新建store存储地区和职业picker选项

src/components/UserInfo/index.tsx

@@ -8,6 +8,7 @@ import { UserService, PickerOption } from "@/services/userService";
 import { PopupPicker } from "@/components/Picker/index";
 import { useUserActions } from "@/store/userStore";
 import { UserInfoType } from "@/services/userService";
+import { useCities, useProfessions } from "@/store/pickerOptionsStore";
 
 // 用户信息接口
 // export interface UserInfo {
@@ -82,33 +83,33 @@ export const UserInfoCard: React.FC<UserInfoCardProps> = ({
   });
 
   // 职业数据
-  const [professions, setProfessions] = useState<PickerOption[]>([]);
+  const professions = useProfessions();
 
   // 城市数据
-  const [cities, setCities] = useState<PickerOption[]>([]);
+  const cities = useCities();
 
   // 页面加载时初始化数据
-  useEffect(() => {
-    getProfessions();
-    getCities();
-  }, []);
+  // useEffect(() => {
+  //   getProfessions();
+  //   getCities();
+  // }, []);
 
-  const getProfessions = async () => {
-    try {
-      const res = await UserService.getProfessions();
-      setProfessions(res);
-    } catch (e) {
-      console.log("获取职业失败：", e);
-    }
-  };
-  const getCities = async () => {
-    try {
-      const res = await UserService.getCities();
-      setCities(res);
-    } catch (e) {
-      console.log("获取职业失败：", e);
-    }
-  };
+  // const getProfessions = async () => {
+  //   try {
+  //     const res = await UserService.getProfessions();
+  //     setProfessions(res);
+  //   } catch (e) {
+  //     console.log("获取职业失败：", e);
+  //   }
+  // };
+  // const getCities = async () => {
+  //   try {
+  //     const res = await UserService.getCities();
+  //     setCities(res);
+  //   } catch (e) {
+  //     console.log("获取职业失败：", e);
+  //   }
+  // };
   // 处理编辑弹窗
   const handle_open_edit_modal = (field: string) => {
     if (field === "gender") {
@@ -223,8 +224,8 @@ export const UserInfoCard: React.FC<UserInfoCardProps> = ({
 
   // 处理职业选择
   const handle_occupation_change = (e: any) => {
-    const [country, province] = e;
-    handle_field_edit("occupation", `${country} ${province}`);
+    const [country, province, city] = e;
+    handle_field_edit("occupation", `${country} ${province} ${city}`);
   };
   const handle_edit_modal_cancel = () => {
     setEditModalVisible(false);
@@ -401,7 +402,7 @@ export const UserInfoCard: React.FC<UserInfoCardProps> = ({
           {user_info.occupation ? (
             <View className="tag_item">
               <Text className="tag_text">
-                {user_info.occupation.split(" ")[1]}
+                {user_info.occupation.split(" ")[2]}
               </Text>
             </View>
           ) : is_current_user ? (

src/store/pickerOptionsStore.ts

@@ -0,0 +1,39 @@
+import { create } from "zustand";
+
+import { UserService } from "@/services/userService";
+
+export interface PickerOptionState {
+  cities: any[];
+  professions: any[];
+  getCities: () => Promise<any>;
+  getProfessions: () => Promise<any>;
+}
+
+export const usePickerOption = create<PickerOptionState>((set) => ({
+  cities: [],
+  professions: [],
+  getCities: async () => {
+    try {
+      const res = await UserService.getCities();
+      set({ cities: res });
+      return res;
+    } catch (e) {
+      console.log("获取城市列表失败：", e);
+      throw e;
+    }
+  },
+  getProfessions: async () => {
+    try {
+      const res = await UserService.getProfessions();
+      set({ professions: res });
+      return res;
+    } catch (e) {
+      console.log("获取职业失败：", e);
+      throw e;
+    }
+  },
+}));
+
+export const useCities = () => usePickerOption((state) => state.cities);
+export const useProfessions = () =>
+  usePickerOption((state) => state.professions);

src/user_pages/edit/index.tsx

@@ -11,6 +11,7 @@ import img from "@/config/images";
 import CommonDialog from "@/components/CommonDialog";
 import { useUserActions, useUserInfo } from "@/store/userStore";
 import { UserInfoType } from "@/services/userService";
+import { useCities, useProfessions } from "@/store/pickerOptionsStore";
 
 const EditProfilePage: React.FC = () => {
   const { updateUserInfo } = useUserActions();
@@ -46,10 +47,10 @@ const EditProfilePage: React.FC = () => {
     useState(false);
 
   // 职业数据
-  const [professions, setProfessions] = useState<PickerOption[]>([]);
+  const professions = useProfessions();
 
   // 城市数据
-  const [cities, setCities] = useState<PickerOption[]>([]);
+  const cities = useCities();
 
   // 监听store中的用户信息变化，同步到表单状态
   useEffect(() => {
@@ -70,27 +71,27 @@ const EditProfilePage: React.FC = () => {
   }, [user_info]);
 
   // 页面加载时初始化数据
-  useEffect(() => {
-    getCities();
-    getProfessions();
-  }, []);
+  // useEffect(() => {
+  //   getCities();
+  //   getProfessions();
+  // }, []);
 
-  const getProfessions = async () => {
-    try {
-      const res = await UserService.getProfessions();
-      setProfessions(res);
-    } catch (e) {
-      console.log("获取职业失败：", e);
-    }
-  };
-  const getCities = async () => {
-    try {
-      const res = await UserService.getCities();
-      setCities(res);
-    } catch (e) {
-      console.log("获取职业失败：", e);
-    }
-  };
+  // const getProfessions = async () => {
+  //   try {
+  //     const res = await UserService.getProfessions();
+  //     setProfessions(res);
+  //   } catch (e) {
+  //     console.log("获取职业失败：", e);
+  //   }
+  // };
+  // const getCities = async () => {
+  //   try {
+  //     const res = await UserService.getCities();
+  //     setCities(res);
+  //   } catch (e) {
+  //     console.log("获取城市列表失败：", e);
+  //   }
+  // };
 
   // 加载用户信息
   // const load_user_info = async () => {
@@ -281,8 +282,8 @@ const EditProfilePage: React.FC = () => {
 
   // 处理职业选择
   const handle_occupation_change = (e: any) => {
-    const [country, province] = e;
-    handle_field_edit("occupation", `${country} ${province}`);
+    const [country, province, city] = e;
+    handle_field_edit("occupation", `${country} ${province} ${city}`);
   };
 
   // 处理退出登录

src/user_pages/myself/index.tsx

@@ -10,9 +10,10 @@ import { TennisMatch } from "@/../types/list/types";
 import { withAuth, NTRPTestEntryCard } from "@/components";
 import { EvaluateScene } from "@/store/evaluateStore";
 import { useUserInfo } from "@/store/userStore";
-import { UserInfoType } from "@/services/userService";
+import { usePickerOption } from "@/store/pickerOptionsStore";
 
 const MyselfPage: React.FC = () => {
+  const pickerOption = usePickerOption();
   // 获取页面参数
   const instance = Taro.getCurrentInstance();
   const user_id = instance.router?.params?.userid || "";
@@ -64,11 +65,10 @@ const MyselfPage: React.FC = () => {
   //   }
   // };
 
-  // useEffect(() => {
-  //   if (user_info.id) {
-  //     load_game_data(); // 在 user_info 更新后调用
-  //   }
-  // }, [user_info]);
+  useEffect(() => {
+    pickerOption.getCities();
+    pickerOption.getProfessions();
+  }, []);
 
   // 页面加载时获取数据
   // useEffect(() => {