代码优化

src/components/BowTarget.vue

@@ -122,6 +122,7 @@ function calcRealY(num) {
   font-size: 12px;
   padding: 4px 7px;
   border-radius: 5px;
+  z-index: 2;
 }
 .round-tip {
   position: absolute;
@@ -130,6 +131,7 @@ function calcRealY(num) {
   color: #fff;
   font-size: 30px;
   font-weight: bold;
+  z-index: 2;
 }
 .round-tip > text {
   font-size: 18px;
@@ -154,6 +156,7 @@ function calcRealY(num) {
   position: absolute;
   width: 20px;
   height: 20px;
+  z-index: 1;
 }
 .header {
   width: 100%;

src/pages/index.vue

@@ -33,12 +33,13 @@ const handleLogin = () => {
       icon: "none",
     });
   }
-  // console.log("getUsername", store.getUsername);
-  uni.getUserProfile({
-    desc: "用于完善用户资料",
+
+  // 先调用wx.getUserProfile获取用户信息
+  wx.getUserProfile({
+    desc: "用于完善用户资料", // 声明获取用户个人信息后的用途
     success: (res) => {
       const { nickName, avatarUrl } = res.userInfo;
-      // 获取登录凭证
+      // 再获取登录凭证
       uni.login({
         provider: "weixin",
         success: async (loginRes) => {
@@ -59,17 +60,14 @@ const handleLogin = () => {
     },
     fail: (err) => {
       console.log("获取用户信息失败：", err);
+      uni.showToast({
+        title: "获取用户信息失败",
+        icon: "none",
+      });
     },
   });
 };
 
-const isLogin = () => {
-  if (!user.value.id) {
-    showModal.value = true;
-  }
-  return !!user.value.id;
-};
-
 const toPage = (path) => {
   if (!user.value.id) {
     showModal.value = true;
@@ -106,7 +104,7 @@ onMounted(async () => {
     </block>
     <block v-else>
       <view
-        @click="toLoginPage"
+        @click="() => (showModal = true)"
         :style="{ marginTop: '20px', paddingLeft: '10px' }"
       >
         <text>微信登录</text>

src/pages/user.vue

@@ -8,6 +8,7 @@ import useStore from "@/store";
 import { storeToRefs } from "pinia";
 const store = useStore();
 const { user } = storeToRefs(store);
+const { updateUser } = store;
 
 const toOrderPage = () => {
   uni.navigateTo({
@@ -40,6 +41,11 @@ const toRankIntroPage = () => {
     url: "/pages/rank-intro",
   });
 };
+const logout = () => {
+  uni.removeStorageSync("token");
+  uni.navigateBack();
+  updateUser();
+};
 </script>
 
 <template>
@@ -78,6 +84,7 @@ const toRankIntroPage = () => {
       <view class="my-grow" @click="toMyGrowthPage">
         <image src="../static/my-grow.png" mode="widthFix" />
       </view>
+      <UserItem title="退出登录(仅用于测试)" :onClick="logout" />
     </view>
   </view>
 </template>

src/store.js

@@ -1,15 +1,17 @@
 import { defineStore } from "pinia";
 
+const defaultUser = {
+  id: "",
+  nickName: "游客",
+  avatarUrl: "../static/avatar.png",
+  trio: 0, // 大于1表示完成了新手引导
+};
+
 // 定义游戏相关的 store
 export default defineStore("store", {
   // 状态
   state: () => ({
-    user: {
-      id: "",
-      nickName: "游客",
-      avatarUrl: "../static/avatar.png",
-      trio: 0, // 大于1表示完成了新手引导
-    },
+    user: defaultUser,
     device: {
       deviceId: "",
       deviceName: "",
@@ -27,7 +29,7 @@ export default defineStore("store", {
   // 方法
   actions: {
     updateUser(user) {
-      this.user = user;
+      this.user = user || defaultUser;
     },
     updateDevice(deviceId, deviceName) {
       this.device.deviceId = deviceId;