chore: 补充 pinia 持久化存储

.eslintrc.cjs

@@ -26,7 +26,7 @@ module.exports = {
       {
         singleQuote: true,
         semi: false,
-        printWidth: 80,
+        printWidth: 100,
         trailingComma: 'all',
         endOfLine: 'auto',
       },

package.json

@@ -58,6 +58,7 @@
     "@dcloudio/uni-mp-weixin": "3.0.0-alpha-3080120230428001",
     "@dcloudio/uni-quickapp-webview": "3.0.0-alpha-3080120230428001",
     "pinia": "^2.0.27",
+    "pinia-plugin-persistedstate": "^3.2.0",
     "vue": "^3.2.45",
     "vue-i18n": "^9.2.2"
   },
@@ -69,7 +70,6 @@
     "@dcloudio/vite-plugin-uni": "3.0.0-alpha-3080120230428001",
     "@rushstack/eslint-patch": "^1.1.4",
     "@types/node": "^18.11.9",
-    "miniprogram-api-typings": "^3.9.1",
     "@uni-helper/uni-app-types": "^0.5.7",
     "@uni-helper/uni-ui-types": "0.5.8",
     "@vitejs/plugin-vue": "^3.0.3",
@@ -80,6 +80,7 @@
     "eslint-plugin-vue": "^9.3.0",
     "husky": "^8.0.0",
     "lint-staged": "^13.0.3",
+    "miniprogram-api-typings": "^3.9.1",
     "prettier": "^2.7.1",
     "sass": "^1.56.1",
     "typescript": "^4.9.3",

pnpm-lock.yaml

@@ -1,5 +1,9 @@
 lockfileVersion: '6.0'
 
+settings:
+  autoInstallPeers: true
+  excludeLinksFromLockfile: false
+
 dependencies:
   '@dcloudio/uni-app':
     specifier: 3.0.0-alpha-3080120230428001
@@ -43,6 +47,9 @@ dependencies:
   pinia:
     specifier: ^2.0.27
     version: 2.0.35(typescript@4.9.3)(vue@3.2.45)
+  pinia-plugin-persistedstate:
+    specifier: ^3.2.0
+    version: 3.2.0(pinia@2.0.35)
   vue:
     specifier: ^3.2.45
     version: 3.2.45
@@ -6329,6 +6336,14 @@ packages:
     resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
     engines: {node: '>=0.10.0'}
 
+  /pinia-plugin-persistedstate@3.2.0(pinia@2.0.35):
+    resolution: {integrity: sha512-tZbNGf2vjAQcIm7alK40sE51Qu/m9oWr+rEgNm/2AWr1huFxj72CjvpQcIQzMknDBJEkQznCLAGtJTIcLKrKdw==}
+    peerDependencies:
+      pinia: ^2.0.0
+    dependencies:
+      pinia: 2.0.35(typescript@4.9.3)(vue@3.2.45)
+    dev: false
+
   /pinia@2.0.35(typescript@4.9.3)(vue@3.2.45):
     resolution: {integrity: sha512-P1IKKQWhxGXiiZ3atOaNI75bYlFUbRxtJdhPLX059Z7+b9Z04rnTZdSY8Aph1LA+/4QEMAYHsTQ638Wfe+6K5g==}
     peerDependencies:
@@ -7352,6 +7367,7 @@ packages:
 
   /w3c-hr-time@1.0.2:
     resolution: {integrity: sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==}
+    deprecated: Use your platform's native performance.now() and performance.timeOrigin.
     dependencies:
       browser-process-hrtime: 1.0.0
     dev: true

src/pages/my/my.vue

@@ -1,9 +1,26 @@
 <script setup lang="ts">
-//
+import { useMemberStore } from '@/stores'
+
+const memberStore = useMemberStore()
 </script>
 
 <template>
-  <view class="my">my</view>
+  <view class="my">
+    <view>会员信息：{{ memberStore.profile }}</view>
+    <button
+      @tap="
+        memberStore.setProfile({
+          nickname: '黑马先锋',
+        })
+      "
+      size="mini"
+      plain
+      type="primary"
+    >
+      保存用户信息
+    </button>
+    <button @tap="memberStore.clearProfile()" size="mini" plain type="warn">清理用户信息</button>
+  </view>
 </template>
 
 <style lang="scss">

src/stores/index.ts

@@ -1,7 +1,13 @@
 import { createPinia } from 'pinia'
+import persist from 'pinia-plugin-persistedstate'
 
-// 创建pinia实例
+// 创建 pinia 实例
 const pinia = createPinia()
+// 使用持久化存储插件
+pinia.use(persist)
 
-// 导出pinia实例，给main使用
+// 默认导出，给 main.ts 使用
 export default pinia
+
+// 模块统一导出
+export * from './modules/member'

src/stores/modules/member.ts

@@ -2,24 +2,31 @@ import { defineStore } from 'pinia'
 import { ref } from 'vue'
 
 // 定义 Store
-export const useMemberStore = defineStore('member', () => {
-  // 会员信息
-  const profile = ref<any>()
+export const useMemberStore = defineStore(
+  'member',
+  () => {
+    // 会员信息
+    const profile = ref<any>()
 
-  // 保存会员信息，登录时使用
-  const setProfile = (val: any) => {
-    profile.value = val
-  }
+    // 保存会员信息，登录时使用
+    const setProfile = (val: any) => {
+      profile.value = val
+    }
 
-  // 清理会员信息，退出时使用
-  const clearProfile = () => {
-    profile.value = undefined
-  }
+    // 清理会员信息，退出时使用
+    const clearProfile = () => {
+      profile.value = undefined
+    }
 
-  // 记得 return
-  return {
-    profile,
-    setProfile,
-    clearProfile,
-  }
-})
+    // 记得 return
+    return {
+      profile,
+      setProfile,
+      clearProfile,
+    }
+  },
+  // TODO: 持久化
+  {
+    persist: true,
+  },
+)