存token
import { defineStore } from 'pinia';
export const userInfo = defineStore('userInfo', {
state: () => {
return {
userToken: uni.getStorageSync('token') || '',
};
},
actions: {
// 添加token
updateToken(token: string) {
uni.setStorageSync('token', token);
this.userToken = token
}
}
});
使用
import {
userInfo
} from '@/stores/userInfo'
import {
ref
} from "vue";
const test = userInfo()
const tst = ref('4')
test.updateToken(tst.value)
效果
这边存 用户信息
定义store 文件
import { defineStore } from 'pinia'
interface Member {
userInfo : AnyObject | null
}
const useMemberStore = defineStore('member', {
state: () : Member => {
return {
userInfo: uni.getStorageSync('userInfo') || null
}
},
actions: {
updateUserInfo(userInfo : AnyObject) {
uni.setStorageSync('userInfo', userInfo)
this.userInfo = userInfo
}
}
})
export default useMemberStore
vue页面 存储数据
import useMemberStore from '@/stores/member'
const user = useMemberStore()
user.updateUserInfo('存对象的数据')
取数据
方法一
弊端 没有初始值 控制台提示报错
在template中 使用 userInfo.member_id
import { storeToRefs } from 'pinia'
import useMemberStore from '@/stores/member'
const info = useMemberStore()
const { userInfo } = storeToRefs(info)
console.log(userInfo.value.member_id, '从缓存中取数据');
打印下 userInfo
方式二
给 默认值 即使userInfo无值也不会报错
template中 直接 {{member_id}} 使用
import useMemberStore from '@/stores/member'
import { ref, computed } from "vue";
const memberStore = useMemberStore()
const userInfo : any = computed(() => memberStore.userInfo)
const member_id = ref(0)
const is_mechanic = ref(0)
if (userInfo.value) {
member_id.value = userInfo.value.member_id
is_mechanic.value = userInfo.value.is_mechanic
}