ソースを参照

feat: 先写好userStore

Burt 2 年 前
コミット
fef57184a6
4 ファイル変更47 行追加1 行削除
  1. 12 1
      src/pages/index/index.vue
  2. 4 0
      src/store/index.ts
  3. 27 0
      src/store/user.ts
  4. 4 0
      src/typings.d.ts

+ 12 - 1
src/pages/index/index.vue

@@ -4,6 +4,8 @@
     <view class="text-area">
       <text class="title">{{ title }}</text>
     </view>
+    <button @click="setUserInfo">设置UserInfo</button>
+    <button @click="clearUserInfo">清除UserInfo</button>
     <view class="flex justify-center items-center text-blue-500">
       Demo Count: {{ countStore.count }}
       <button class="ml-2" @click="countStore.increment">新增</button>
@@ -22,13 +24,22 @@
 
 <script setup lang="ts" name="TestIndex">
 import { ref } from 'vue'
-import { useCountStore } from '@/store/count'
+import { useCountStore, useUserStore } from '@/store'
 
 const countStore = useCountStore()
 const title = ref('Hello')
 
 const uniLayout = ref()
 console.log(uniLayout)
+
+const userStore = useUserStore()
+
+const setUserInfo = () => {
+  userStore.setUserInfo({ username: 'fly', token: 'abcdef' })
+}
+const clearUserInfo = () => {
+  userStore.clearUserInfo()
+}
 </script>
 
 <style>

+ 4 - 0
src/store/index.ts

@@ -13,3 +13,7 @@ store.use(
 )
 
 export default store
+
+// 模块统一导出
+export * from './user'
+export * from './count'

+ 27 - 0
src/store/user.ts

@@ -0,0 +1,27 @@
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import { UserInfo } from '../typings'
+
+export const useUserStore = defineStore(
+  'user',
+  () => {
+    const userInfo = ref<UserInfo>()
+
+    const setUserInfo = (val: UserInfo) => {
+      userInfo.value = val
+    }
+
+    const clearUserInfo = () => {
+      userInfo.value = undefined
+    }
+
+    return {
+      userInfo,
+      setUserInfo,
+      clearUserInfo,
+    }
+  },
+  {
+    persist: true,
+  },
+)

+ 4 - 0
src/typings.d.ts

@@ -0,0 +1,4 @@
+export type UserInfo = {
+  username: string
+  token: string
+}