feat(pinia): 引入pinia

package.json

@@ -74,6 +74,8 @@
     "@dcloudio/uni-mp-weixin": "3.0.0-3081220230817001",
     "@dcloudio/uni-quickapp-webview": "3.0.0-3081220230817001",
     "dayjs": "^1.11.10",
+    "pinia": "^2.0.36",
+    "pinia-plugin-persistedstate": "^3.2.1",
     "vue": "3.2.47",
     "vue-i18n": "^9.1.9"
   },

pnpm-lock.yaml

@@ -47,6 +47,12 @@ dependencies:
   dayjs:
     specifier: ^1.11.10
     version: 1.11.10
+  pinia:
+    specifier: ^2.0.36
+    version: 2.0.36(typescript@4.9.5)(vue@3.2.47)
+  pinia-plugin-persistedstate:
+    specifier: ^3.2.1
+    version: 3.2.1(pinia@2.0.36)
   vue:
     specifier: 3.2.47
     version: 3.2.47
@@ -10117,6 +10123,32 @@ packages:
     engines: {node: '>=6'}
     dev: true
 
+  /pinia-plugin-persistedstate@3.2.1(pinia@2.0.36):
+    resolution: {integrity: sha512-MK++8LRUsGF7r45PjBFES82ISnPzyO6IZx3CH5vyPseFLZCk1g2kgx6l/nW8pEBKxxd4do0P6bJw+mUSZIEZUQ==}
+    peerDependencies:
+      pinia: ^2.0.0
+    dependencies:
+      pinia: 2.0.36(typescript@4.9.5)(vue@3.2.47)
+    dev: false
+
+  /pinia@2.0.36(typescript@4.9.5)(vue@3.2.47):
+    resolution: {integrity: sha512-4UKApwjlmJH+VuHKgA+zQMddcCb3ezYnyewQ9NVrsDqZ/j9dMv5+rh+1r48whKNdpFkZAWVxhBp5ewYaYX9JcQ==}
+    peerDependencies:
+      '@vue/composition-api': ^1.4.0
+      typescript: '>=4.4.4'
+      vue: ^2.6.14 || ^3.2.0
+    peerDependenciesMeta:
+      '@vue/composition-api':
+        optional: true
+      typescript:
+        optional: true
+    dependencies:
+      '@vue/devtools-api': 6.5.1
+      typescript: 4.9.5
+      vue: 3.2.47
+      vue-demi: 0.14.6(vue@3.2.47)
+    dev: false
+
   /pinkie-promise@2.0.1:
     resolution: {integrity: sha512-0Gni6D4UcLTbv9c57DfxDGdr41XfgUjqWZu492f0cIGr16zDU06BWP/RAEvOuo7CQ0CNjHaLlM59YJJFm3NWlw==}
     engines: {node: '>=0.10.0'}
@@ -12036,7 +12068,6 @@ packages:
     resolution: {integrity: sha512-1FXk9E2Hm+QzZQ7z+McJiHL4NW1F2EzMu9Nq9i3zAaGqibafqYwCVU6WyWAuyQRRzOlxou8xZSyXLEN8oKj24g==}
     engines: {node: '>=4.2.0'}
     hasBin: true
-    dev: true
 
   /ufo@1.3.2:
     resolution: {integrity: sha512-o+ORpgGwaYQXgqGDwd+hkS4PuZ3QnmqMMxRuajK/a38L6fTpcE5GPIfrf+L/KemFzfUpeUQc1rRS1iDBozvnFA==}
@@ -12486,7 +12517,6 @@ packages:
         optional: true
     dependencies:
       vue: 3.2.47
-    dev: true
 
   /vue-eslint-parser@9.3.2(eslint@8.56.0):
     resolution: {integrity: sha512-q7tWyCVaV9f8iQyIA5Mkj/S6AoJ9KBN8IeUSf3XEmBrOtxOZnfTg5s4KClbZBCK3GtnT/+RyCLZyDHuZwTuBjg==}

src/main.ts

@@ -1,10 +1,12 @@
 import { createSSRApp } from 'vue'
 import App from './App.vue'
+import store from './store'
 import 'virtual:svg-icons-register'
 import 'virtual:uno.css'
 
 export function createApp() {
   const app = createSSRApp(App)
+  app.use(store)
   return {
     app,
   }

src/pages/index/index.vue

@@ -4,13 +4,20 @@
     <view class="text-area">
       <text class="title">{{ title }}</text>
     </view>
+    <view class="flex text-red-500">
+      Demo Count: {{ countStore.count }}
+      <button @click="countStore.increment">新增</button>
+    </view>
   </view>
 </template>
 
 <script setup lang="ts" name="TestIndex">
 import { ref } from 'vue'
+import { useCountStore } from '@/store/count'
 import { fun, fun as yy } from '../../test/import-sort'
 
+const countStore = useCountStore()
+
 uni.showModal({
   title: '提示',
   content: '这是一个模态弹窗',

src/store/count.ts

@@ -0,0 +1,20 @@
+// src/store/use_count_store.ts
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+
+export const useCountStore = defineStore(
+  'count',
+  () => {
+    const count = ref(0)
+    const increment = () => {
+      count.value++
+    }
+    return {
+      count,
+      increment,
+    }
+  },
+  {
+    persist: true,
+  },
+)

src/store/index.ts

@@ -0,0 +1,8 @@
+// src/store/index.ts
+import { createPinia } from 'pinia'
+import piniaPersist from 'pinia-plugin-persistedstate' // 数据持久化
+
+const store = createPinia()
+store.use(piniaPersist)
+
+export default store