Parcourir la source

♻️ refactor(classroom): 重构教室页面参数获取方式

- 修改路由参数名从:id改为:classId,提高可读性
- 使用useParams替代useSearchParams获取路由参数
- 从pathParams直接初始化classId状态,简化参数传递流程
yourname il y a 6 mois
Parent
commit
7b9ad62ecf

+ 3 - 3
src/client/mobile/components/Classroom/useClassroom.ts

@@ -85,14 +85,14 @@ export const useClassroom = ({ user }:{ user : User }) => {
   // 状态管理
   // const [userId, setUserId] = useState<string>(''); // 保持string类型
 
-  const [searchParams] = useSearchParams();
+  const pathParams = useParams()
   const userId = user.id.toString();
   const [isCameraOn, setIsCameraOn] = useState<boolean>(false);
   const [isAudioOn, setIsAudioOn] = useState<boolean>(false);
   const [isScreenSharing, setIsScreenSharing] = useState<boolean>(false);
   const [className, setClassName] = useState<string>('');
-  const [role, setRole] = useState<Role>(searchParams.get('role') === Role.Teacher ? Role.Teacher : Role.Student);
-  const [classId, setClassId] = useState<string>('');
+  const [role, setRole] = useState<Role>(pathParams['role'] === Role.Teacher ? Role.Teacher : Role.Student);
+  const [classId, setClassId] = useState<string>(pathParams['classId'] || '');
   const [isLoggedIn, setIsLoggedIn] = useState<boolean>(false);
   const [isJoinedClass, setIsJoinedClass] = useState<boolean>(false);
   const [msgText, setMsgText] = useState<string>('');

+ 1 - 1
src/client/mobile/routes.tsx

@@ -77,7 +77,7 @@ export const router = createBrowserRouter([
     ),
   },
   {
-    path: '/mobile/classroom/:id/:role',
+    path: '/mobile/classroom/:classId/:role',
     element: <ProtectedRoute><ClassroomPage /></ProtectedRoute>,
     errorElement: <ErrorPage />
   },