diff --git a/package.json b/package.json index f439f2b..ee80359 100644 --- a/package.json +++ b/package.json @@ -10,6 +10,7 @@ "@dcloudio/uni-app": "3.0.0-4050620250312001", "@dcloudio/uni-components": "3.0.0-4050620250312001", "@dcloudio/uni-mp-weixin": "3.0.0-4050620250312001", + "pinia": "2.0.36", "vue": "3.4.21" }, "devDependencies": { diff --git a/src/main.js b/src/main.js index 22ad219..4501e2c 100644 --- a/src/main.js +++ b/src/main.js @@ -1,9 +1,12 @@ import { createSSRApp } from 'vue' +import { createPinia } from 'pinia' import App from './App.vue' export function createApp() { const app = createSSRApp(App) + const pinia = createPinia() + app.use(pinia) return { - app, + app } } diff --git a/src/pages/index.vue b/src/pages/index.vue index 65f9b1c..dd90de7 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -3,7 +3,16 @@ import { ref, onMounted } from "vue"; import AppFooter from "@/components/AppFooter.vue"; import AppBackground from "@/components/AppBackground.vue"; import UserHeader from "@/components/UserHeader.vue"; -import { getAppConfig } from '@/apis' +import { getAppConfig } from "@/apis"; + +// import useStore from "@/store"; + +import { storeToRefs } from "pinia"; +// const store = useStore(); +// 使用actions方法 +// const { updateUsername } = store; +// 使用storeToRefs,用于UI里显示,保持响应性 +// const { user } = storeToRefs(store); // 添加登录状态和用户信息 const isLogin = ref(true); @@ -17,7 +26,7 @@ const userInfo = ref({ // 检查登录状态 const checkLogin = () => { - const storedUserInfo = uni.getStorageSync('userInfo'); + const storedUserInfo = uni.getStorageSync("userInfo"); if (storedUserInfo) { userInfo.value = JSON.parse(storedUserInfo); isLogin.value = true; @@ -26,17 +35,19 @@ const checkLogin = () => { // 处理微信登录 const handleLogin = () => { + // console.log("getUsername", store.getUsername); + // updateUsername("we0f9we9f08"); uni.getUserProfile({ - desc: '用于完善用户资料', + desc: "用于完善用户资料", success: (res) => { const { userInfo: wxUserInfo } = res; - console.log('wxUserInfo', wxUserInfo); + console.log("wxUserInfo", wxUserInfo); // 获取登录凭证 uni.login({ - provider: 'weixin', + provider: "weixin", success: async (loginRes) => { const { code } = loginRes; - console.log('loginRes', loginRes); + console.log("loginRes", loginRes); // 这里可以把 code 和用户信息发送到后端 // const result = await loginAPI(code, wxUserInfo); // 暂时直接使用微信返回的用户信息 @@ -48,26 +59,27 @@ const handleLogin = () => { rankTotal: 0, }; isLogin.value = true; - + // 保存到本地存储 - uni.setStorageSync('userInfo', JSON.stringify(userInfo.value)); + uni.setStorageSync("userInfo", JSON.stringify(userInfo.value)); }, fail: (err) => { uni.showToast({ - title: '登录失败', - icon: 'none' + title: "登录失败", + icon: "none", }); - console.error('登录失败:', err); - } + console.error("登录失败:", err); + }, }); }, fail: (err) => { - console.log('获取用户信息失败:', err); - } + console.log("获取用户信息失败:", err); + }, }); }; const toFristTryPage = () => { + console.log("username", username); uni.navigateTo({ url: "/pages/first-try", }); @@ -98,13 +110,13 @@ const toQquipmentPage = () => { // 获取全局配置 const getConfig = async () => { try { - const config = await getAppConfig() - console.log('全局配置:', config) + const config = await getAppConfig(); + console.log("全局配置:", config); // 这里可以处理配置数据 } catch (error) { - console.error('获取配置失败:', error) + console.error("获取配置失败:", error); } -} +}; // 页面加载完成后检查本地存储的用户信息并获取配置 onMounted(() => { @@ -128,7 +140,11 @@ onMounted(() => { - + 我的弓箭 ({ + user: { + username: "游客", + }, + }), + + // 计算属性 + getters: { + getUsername: (state) => { + return state.user.username; + }, + }, + + // 方法 + actions: { + updateUsername(newUsername) { + this.user.username = newUsername; + }, + }, + + // 开启数据持久化 + persist: { + enabled: true, + strategies: [ + { + storage: uni.getStorageSync, + paths: ["user"], // 只持久化用户信息 + }, + ], + }, +}); diff --git a/yarn.lock b/yarn.lock index 7fce08b..7555d83 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1908,7 +1908,7 @@ "@vue/compiler-dom" "3.5.13" "@vue/shared" "3.5.13" -"@vue/devtools-api@^6.6.4": +"@vue/devtools-api@^6.5.0", "@vue/devtools-api@^6.6.4": version "6.6.4" resolved "https://registry.npmjs.org/@vue/devtools-api/-/devtools-api-6.6.4.tgz#cbe97fe0162b365edc1dba80e173f90492535343" integrity sha512-sGhTPMuXqZ1rVOk32RylztWkfXTRhuS7vgAKv0zjqk8gbsHkJ7xfFf+jbySxt7tWObEJwyKaHMikV/WGDiQm8g== @@ -3183,6 +3183,14 @@ pify@^2.3.0: resolved "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c" integrity sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog== +pinia@2.0.36: + version "2.0.36" + resolved "https://registry.npmjs.org/pinia/-/pinia-2.0.36.tgz#65130f3b94cc7fe25156308634010fab893dff24" + integrity sha512-4UKApwjlmJH+VuHKgA+zQMddcCb3ezYnyewQ9NVrsDqZ/j9dMv5+rh+1r48whKNdpFkZAWVxhBp5ewYaYX9JcQ== + dependencies: + "@vue/devtools-api" "^6.5.0" + vue-demi "*" + pixelmatch@^4.0.2: version "4.0.2" resolved "https://registry.npmjs.org/pixelmatch/-/pixelmatch-4.0.2.tgz#8f47dcec5011b477b67db03c243bc1f3085e8854" @@ -3820,6 +3828,11 @@ vite@5.2.8: optionalDependencies: fsevents "~2.3.3" +vue-demi@*: + version "0.14.10" + resolved "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz#afc78de3d6f9e11bf78c55e8510ee12814522f04" + integrity sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg== + vue-router@^4.3.0: version "4.5.0" resolved "https://registry.npmjs.org/vue-router/-/vue-router-4.5.0.tgz#58fc5fe374e10b6018f910328f756c3dae081f14"