修改路由

src/components/HomePage.vue

@@ -162,14 +162,14 @@ const selectedButton = ref('AI通识课')
 const indexImages = ref([intelligenceImg, roomImg, testImg, studyImg])
 // AI初体验
 const goToAIGeneralCourse = title => {
-  router.push({ path: '/ai-general-course', query: { title } })
+  router.push({ path: '/ai-general-course', state: { title } })
 }
 //AI实验室
 const goToAILab = () => {
   router.push({
     path: '/ai-laboratory',
     // 跳转页面携带下拉菜单选中项的值
-    query: { grade: selectedGrade.value }
+    state: { grade: selectedGrade.value }
   })
 }
 

src/components/LeftPanel.vue

@@ -113,7 +113,7 @@ const groupList = ref([
 // 优化后的更新选中状态的方法
 const updateActiveIndex = () => {
   const path = route.path;
-  const from = route.query.from;
+  const from = window.history.state?.from; // 从history.state获取来源信息
   // 使用映射表存储路径和索引的对应关系
   const pathIndexMap = {
     'ai-questions': '0', // 智能问答
@@ -178,7 +178,7 @@ const navigateToAI = async (group) => {
         router
           .push({
             path: '/ai-questions',
-            query: {
+            state: {
               ...personData.value,
               category: grade + 'AI'
             }

src/components/ai/text/TextToText.vue

@@ -555,11 +555,12 @@ onMounted(async () => {
       personName.value = aiPerson.name;
       personImage.value = aiPerson.model2dPath;
       personIntroduce.value = aiPerson.systemMessage;
-
-      selectedImage.value = personImage.value;
     }
   }
 
+  // 确保selectedImage被设置
+  selectedImage.value = personImage.value;
+
   // 智能问答
   CreateDialogue({ roleId: personId.value })
       .then((res) => {
@@ -607,6 +608,17 @@ watch(
   },
   { immediate: true, deep: true }
 );
+
+// 监听personImage变化，更新selectedImage
+watch(
+  () => personImage.value,
+  (newImage) => {
+    if (newImage) {
+      selectedImage.value = newImage;
+    }
+  },
+  { immediate: true }
+);
 // 组件卸载时清理语音资源
 onUnmounted(() => {
   stopPlayback();

src/views/AIPage/AIDevelop.vue

@@ -471,7 +471,7 @@ const getAllCourseSections = () => {
 // 渲染 课程数据结构 以及 视频
 onMounted(async () => {
 
-   const typeIdParam = router.currentRoute.value.query.typeId
+   const typeIdParam = history.state?.typeId || router.currentRoute.value.query.typeId
   if (typeIdParam) {
     typeId.value = typeIdParam
     try {
@@ -558,12 +558,12 @@ onMounted(async () => {
     }
   }
 
-  const title = router.currentRoute.value.query.typeName
+  const title = history.state?.typeName || router.currentRoute.value.query.typeName
   if (title) {
     boxIconTitle.value = String(title)
   }
 
-  typeSort.value = router.currentRoute.value.query.typeSort
+  typeSort.value = history.state?.typeSort || router.currentRoute.value.query.typeSort
   // 初始化年级ID
   gradeId.value = globalState.initGradeId()
 

src/views/AIPage/AIGeneralCourse.vue

@@ -295,7 +295,7 @@ const courseTitles = computed(() => {
 const pageTitle = ref('AI智能课')
 onMounted(() => {
   fetchCtTypes()
-  const title = router.currentRoute.value.query.title
+  const title = history.state?.title
   if (title) {
     pageTitle.value = title
   }
@@ -372,9 +372,9 @@ const goToAIExperience = outlineData => {
   //   }
   // }
   router.push({
-    path: '/ai-develop', // 跳转视频页面
-    query: { typeId: outlineData.id, typeName: outlineData.ctType, typeSort:outlineData.ctTypeSort }
-  })
+      path: '/ai-develop', // 跳转视频页面
+      state: { typeId: outlineData.id, typeName: outlineData.ctType, typeSort:outlineData.ctTypeSort }
+    })
 }
 </script>
 

src/views/AIPage/AILaboratory.vue

@@ -97,7 +97,8 @@ const peopleList = ref([])
 
 onMounted(async () => {
   try {
-    grade.value = route.query.grade || localStorage.getItem('selectedGrade')
+    // 使用history.state接收参数，如果没有则从localStorage获取
+    grade.value = history.state?.grade || localStorage.getItem('selectedGrade')
     // 获取小学低年级数据
     const juniorRes = await teacherList({ category: grade.value })
     peopleList.value = juniorRes.data.list.map(person => ({
@@ -116,11 +117,11 @@ onMounted(async () => {
 const navigateToAIQuestions = person => {
   router.push({
     path: '/ai-questions',
-    query: {
+    state: {
       ...person,
       from: 'ai-laboratory', 
       category: grade.value
-    },
+    }
   })
 }
 

src/views/AIPage/AIQuestions.vue

@@ -63,7 +63,7 @@ const toggleDrawer = () => {
 // 返回上一页
 const goBack = () => {
   // 根据来源页面决定返回路径
-  const fromPage = route.query.from;
+  const fromPage = window.history.state?.from;
   if (fromPage === 'ai-ennumerals') {
     router.push("/ai-ennumerals");
   } else if (fromPage === 'ai-laboratory' || !fromPage) {
@@ -77,22 +77,23 @@ const goBack = () => {
 const router = useRouter();
 const route = useRoute();
 
-const personId = ref(route.query.id);
-const personName = ref(route.query.name);
-const personIntroduce = ref(route.query.message);
-const personImage = ref(route.query.image);
+// 从history.state获取参数
+const personId = ref(window.history.state?.id || '');
+const personName = ref(window.history.state?.name || '');
+const personIntroduce = ref(window.history.state?.message || '');
+const personImage = ref(window.history.state?.image || '');
 
-// 路由参数变化监听
+// 监听history.state变化
 watch(
-  () => route.query,
-  (newQuery, oldQuery) => {
+  () => window.history.state,
+  (newState, oldState) => {
     // 只有当id变化时才更新数据，避免不必要的刷新
-    if (newQuery.id && newQuery.id !== oldQuery?.id) {
+    if (newState?.id && newState.id !== oldState?.id) {
       // 更新相关数据
-      personId.value = newQuery.id;
-      personName.value = newQuery.name;
-      personIntroduce.value = newQuery.message;
-      personImage.value = newQuery.image;
+      personId.value = newState.id;
+      personName.value = newState.name;
+      personIntroduce.value = newState.message;
+      personImage.value = newState.image;
     }
   },
   { immediate: true, deep: true }

src/views/EnNumerals/index.vue

@@ -111,11 +111,11 @@ onMounted(async () => {
 const navigateToAIQuestions = (person) => {
   router.push({
     path: "/ai-questions",
-    query: {
+    state: {
       ...person,
       from: "ai-ennumerals",
       category: grade.value,
-    },
+    }
   });
 };
 

src/views/PromotionLogin.vue

@@ -76,7 +76,14 @@ const autoLogin = async () => {
 
       ElMessage.success('信息校验成功')
       // 跳转到课程界面
-      router.push('/ai-develop?typeId=5&typeName=AI%E6%97%B6%E5%85%89%E6%97%85%E8%A1%8C&typeSort=02')
+      router.push({
+        path: '/ai-develop',
+        state: {
+          typeId: 5,
+          typeName: 'AI时光旅行',
+          typeSort: '02'
+        }
+      })
     } else {
       ElMessage.error(res?.message || '信息校验失败')
       // 如果登录失败，跳转到正常登录页面

src/views/programming/ProgrammingCourset.vue

@@ -276,17 +276,17 @@ const fetchCourseData = () => {
 
 // 组件挂载时获取路由参数设置标题
 onMounted(() => {
-  // 批量获取并设置路由参数
-  const courseTitle = route.query.courseTitle;
+  // 从history.state中获取参数
+  const courseTitle = history.state?.courseTitle;
   if (courseTitle) {
     pageTitle.value = courseTitle;
   }
   
   // 一次性设置多个响应式数据
-  typeId.value = route.query.typeId;
-  originalCourseId.value = route.query.originalCourseId;
-  originalCourseTitle.value = route.query.originalCourseTitle;
-  isDisabled.value = Boolean(isDisabled.value);
+  typeId.value = history.state?.typeId;
+  originalCourseId.value = history.state?.originalCourseId;
+  originalCourseTitle.value = history.state?.originalCourseTitle;
+  isDisabled.value = Boolean(history.state?.isDisabled);
 
   // 获取到topicId后，调用函数获取课程列表
   fetchCourseData();
@@ -318,10 +318,10 @@ const handleCourseItemClick = (item) => {
 const goBackIndex = () => {
   // 隐藏视频和游戏界面
   showVideo.value = false
-  // 返回时携带原始的课程参数，使用categoryId保持与ProgrammingList.vue中参数名一致
+  // 返回时携带原始的课程参数
   router.push({
     path: '/programminglist',
-    query: {
+    state: {
       categoryId: originalCourseId.value,
       courseTitle: originalCourseTitle.value
     }

src/views/programming/ProgrammingGame.vue

@@ -185,7 +185,7 @@ const nextSlide = () => {
 const goToProgrammingList = (course, index) => {
   router.push({
     path: '/programminglist',
-    query: {
+    state: {
       courseIndex: index,
       courseTitle: course.title,
       categoryId: course.id

src/views/programming/ProgrammingList.vue

@@ -240,11 +240,12 @@ const middleBox = ref(null)
 
 // 组件挂载时获取路由参数设置标题和课程ID
 onMounted(() => {
-  const title = route.query.courseTitle
+  // history.state中获取参数
+  const title = history.state?.courseTitle
   if (title) {
     pageTitle.value = title
   }
-  const id = route.query.categoryId
+  const id = history.state?.categoryId
   if (id) {
     categoryId.value = id
     // 获取到categoryId后调用getTypeByThemeId接口
@@ -261,10 +262,10 @@ const goToProgrammingList = (courseType, index) => {
   }
   // 设置当前选中项
   activeButton.value = index;
-  // 跳转ProgrammingCourset页面，并传递课程信息作为参数
+  // 跳转ProgrammingCourset页面，并传递课程信息作为参数（使用state避免参数显示在地址栏）
   router.push({
     path: '/programmingCourset',
-    query: {
+    state: {
       courseTitle: courseType.title,
       courseIndex: index,
       typeId: courseType.id, // 当前类型的id，避免与课程ID混淆