2.0 KiB
2.0 KiB
user.ts (Store)
路径:src/stores/user.ts
功能用途
用户登录态与基础信息的 Pinia Store,管理 token、user、余额,并提供鉴权请求头。登录数据持久化到 localStorage(键 poly-user)。
核心能力
token、user:登录凭证与用户信息isLoggedIn、avatarUrl:派生状态balance:USDC 余额显示(如 "0.00"),支持 UserSocket 实时推送更新setUser:设置登录数据并持久化,登录成功后自动连接 UserSocketlogout:清空并断开 UserSocketgetAuthHeaders:返回{ 'x-token', 'x-user-id' },未登录时返回undefinedfetchUserInfo、fetchUsdcBalance:拉取并更新用户信息与余额;fetchUserInfo兼容多种 API 字段名(id/ID、userName/username 等)- 内部
parseUserId:从 API 返回的 user 对象解析 id/ID,兼容 number 与 string,供setUser与fetchUserInfo复用 connectUserSocket、disconnectUserSocket:连接/断开sdk/userSocket的 UserSdk,用于订单/持仓/余额实时推送
使用方式
import { useUserStore } from '@/stores/user'
const userStore = useUserStore()
// 登录后设置
userStore.setUser({ token: 'xxx', user: { id: 1, nickName: 'User' } })
// 鉴权请求
const headers = userStore.getAuthHeaders()
if (headers) {
await someApiCall(undefined, { headers })
}
// 刷新余额
await userStore.fetchUsdcBalance()
扩展方式
- 订单/持仓推送:在
connectUserSocket中注册onOrderUpdate、onPositionUpdate,触发 Wallet 刷新 - 多端登录:扩展
setUser支持多设备 token 管理 - Token 刷新:在
getAuthHeaders或请求拦截器中加入 refresh 逻辑
登录后刷新用户信息
钱包登录(Login.vue)成功后需调用 fetchUserInfo() 以获取完整用户信息(头像、昵称)。App.vue 在 onMounted 与 watch(isLoggedIn) 时也会调用,确保自动登录或刷新页面后能正确显示。