fix: 修复跳转刷新问题

Yi.Bbs.Vue3/src/views/Article.vue

@@ -9,14 +9,16 @@
                 <el-button
                     style="width: 100%; margin-bottom: 0.8rem"
                     @click="loadDiscuss(true)"
-                  >主题首页</el-button
+                >主题首页
+                </el-button
                 >
                 <el-button
                     v-if="isAddArticle && isArticleUser"
                     @click="addArticle('00000000-0000-0000-0000-000000000000')"
                     type="primary"
                     style="width: 100%; margin-bottom: 0.8rem; margin-left: 0"
-                  >添加子文章</el-button
+                >添加子文章
+                </el-button
                 >
                 <!--目录在这里 -->
                 <el-scrollbar style="min-height: 410px">
@@ -40,20 +42,20 @@
               </template>
             </InfoCard>
           </el-col>
-<!--          <el-col :span="24">-->
+          <!--          <el-col :span="24">-->
-<!--            <InfoCard :items="items" header="内容推荐" text="更多">-->
+          <!--            <InfoCard :items="items" header="内容推荐" text="更多">-->
-<!--              <template #item="temp">-->
+          <!--              <template #item="temp">-->
-<!--                <AvatarInfo />-->
+          <!--                <AvatarInfo />-->
-<!--              </template>-->
+          <!--              </template>-->
-<!--            </InfoCard>-->
+          <!--            </InfoCard>-->
-<!--          </el-col>-->
+          <!--          </el-col>-->
         </el-row>
       </el-col>
 
       <el-col :span="14">
         <el-row class="left-div">
           <el-col :span="24">
-            <Breadcrumb :breadcrumbsList="breadcrumbsList" class="breadcrumb" />
+            <Breadcrumb :breadcrumbsList="breadcrumbsList" class="breadcrumb"/>
             <!-- {{ discuss.user }} -->
             <AvatarInfo
                 :size="50"
@@ -64,22 +66,22 @@
             <!-- :userInfo="{nick:'qwe'} -->
 
             <h2>{{ discuss.title }}</h2>
-            <h5 class="subtitle">{{discuss.introduction  }}</h5>
+            <h5 class="subtitle">{{ discuss.introduction }}</h5>
             <el-image
                 :preview-src-list="[getUrl(discuss.cover)]"
                 v-if="discuss.cover"
                 :src="getUrl(discuss.cover)"
                 style="width: 150px; height: 150px"
             />
-            <el-divider />
+            <el-divider/>
             <ArticleContentInfo
                 :code="discuss.content ?? ''"
             ></ArticleContentInfo>
 
-            <el-divider class="tab-divider" />
+            <el-divider class="tab-divider"/>
 
             <el-space :size="10" :spacer="spacer">
-              <AgreeInfo :data="discuss" />
+              <AgreeInfo :data="discuss"/>
               <el-button icon="Star" text> 0</el-button>
               <el-button icon="Share" text> 分享</el-button>
               <el-button icon="Operation" text> 操作</el-button>
@@ -87,10 +89,10 @@
           </el-col>
 
           <el-col :span="24" class="comment">
-            <CommentInfo :isComment="isDisabledCreateComment" />
+            <CommentInfo :isComment="isDisabledCreateComment"/>
           </el-col>
         </el-row>
-        <BottomInfo />
+        <BottomInfo/>
       </el-col>
 
       <el-col :span="5">
@@ -111,14 +113,16 @@
                           size="default"
                           v-if="isEditTheme && isArticleUser"
                           @click="updateHander(route.params.discussId)"
-                        >编辑</el-button
+                      >编辑
+                      </el-button
                       >
                       <el-button
                           style="margin-left: 1rem"
                           type="danger"
                           v-if="isRemoveTheme && isArticleUser"
                           @click="delHander(route.params.discussId)"
-                        >删除</el-button
+                      >删除
+                      </el-button
                       >
                     </li>
                     <li>分类： <span>主题</span></li>
@@ -146,7 +150,8 @@
                           style="width: 100%; justify-content: left"
                           type="primary"
                           text
-                        >{{ `${i + 1} ： ${item}` }}</el-button
+                      >{{ `${i + 1} ： ${item}` }}
+                      </el-button
                       >
                     </li>
                   </ul>
@@ -160,57 +165,57 @@
                 <ThemeData :themeData="temp"/>
               </template>
             </InfoCard>
-<!--            <InfoCard :items="items" header="其他" text="更多">-->
+            <!--            <InfoCard :items="items" header="其他" text="更多">-->
-<!--              <template #item="temp">-->
+            <!--              <template #item="temp">-->
-<!--                <AvatarInfo />-->
+            <!--                <AvatarInfo />-->
-<!--              </template>-->
+            <!--              </template>-->
-<!--            </InfoCard>-->
+            <!--            </InfoCard>-->
           </el-col>
-<!--          <el-col :span="24">-->
+          <!--          <el-col :span="24">-->
-<!--            <InfoCard :items="items" header="其他" text="更多">-->
+          <!--            <InfoCard :items="items" header="其他" text="更多">-->
-<!--              <template #item="temp">-->
+          <!--              <template #item="temp">-->
-<!--                <AvatarInfo />-->
+          <!--                <AvatarInfo />-->
-<!--              </template>-->
+          <!--              </template>-->
-<!--            </InfoCard>-->
+          <!--            </InfoCard>-->
-<!--          </el-col>-->
+          <!--          </el-col>-->
         </el-row>
       </el-col>
     </el-row>
   </div>
 </template>
 <script setup>
-import { h, ref, onMounted, watch, computed } from "vue";
+import {h, ref, onMounted, watch, computed} from "vue";
 import AvatarInfo from "@/components/AvatarInfo.vue";
 import InfoCard from "@/components/InfoCard.vue";
 import ArticleContentInfo from "@/components/ArticleContentInfo.vue";
 import CommentInfo from "@/components/CommentInfo.vue";
 import BottomInfo from "@/components/BottomInfo.vue";
 import TreeArticleInfo from "@/components/TreeArticleInfo.vue";
-import { useRoute, useRouter } from "vue-router";
+import {useRoute, useRouter} from "vue-router";
 import AgreeInfo from "@/components/AgreeInfo.vue";
-import { get as discussGet, del as discussDel } from "@/apis/discussApi.js";
+import {get as discussGet, del as discussDel} from "@/apis/discussApi.js";
 import {
   all as articleall,
   del as articleDel,
   get as articleGet,
 } from "@/apis/articleApi.js";
 import Breadcrumb from "@/components/Breadcrumb/index.vue";
-import { getPermission } from "@/utils/auth";
+import {getPermission} from "@/utils/auth";
 import useUserStore from "@/stores/user.js";
 import ThemeData from "@/views/home/components/RecommendTheme/index.vue";
-import {getRecommendedTopic,getAuthorTopic} from "@/apis/analyseApi";
+import {getRecommendedTopic, getAuthorTopic} from "@/apis/analyseApi";
 //数据定义
 const route = useRoute();
 const router = useRouter();
-const spacer = h(ElDivider, { direction: "vertical" });
+const spacer = h(ElDivider, {direction: "vertical"});
 //子文章数据
 const articleData = ref([]);
 //主题内容
 const discuss = ref({});
 //推荐主题
-const themeList=ref([]);
+const themeList = ref([]);
 //作者主题
-const authorList=ref([]);
+const authorList = ref([]);
 //封面url
 const getUrl = (str) => {
   return `${import.meta.env.VITE_APP_BASEAPI}/file/${str}`;
@@ -242,9 +247,9 @@ const loadArticleData = async () => {
 //主题初始化
 const isDisabledCreateComment = ref(false);
 const isArticleUser = ref(false);
-const { isHasPermission: isAddArticle } = getPermission("bbs:article:add");
+const {isHasPermission: isAddArticle} = getPermission("bbs:article:add");
-const { isHasPermission: isEditTheme } = getPermission("bbs:discuss:update");
+const {isHasPermission: isEditTheme} = getPermission("bbs:discuss:update");
-const { isHasPermission: isRemoveTheme } = getPermission("bbs:discuss:del");
+const {isHasPermission: isRemoveTheme} = getPermission("bbs:discuss:del");
 const loadDiscuss = async (isRewrite) => {
   if (isRewrite) {
     //跳转路由
@@ -377,11 +382,11 @@ const delArticle = (node, data) => {
     });
   });
 };
-const loadThemeData =async () => {
+const loadThemeData = async () => {
   const {data: themeData} = await getRecommendedTopic();
   themeList.value = themeData;
 }
-const loadAuthorData=async () => {
+const loadAuthorData = async () => {
   const {data: authorData} = await getAuthorTopic(discuss.value.user.id);
   authorList.value = authorData;
 }
@@ -391,7 +396,14 @@ onMounted(async () => {
   await loadAuthorData();
   await loadThemeData();
 });
-
+//路由发送变化，重新加载
+watch(() => route.params, async () => {
+      await loadDiscuss();
+      await loadArticleData();
+      await loadAuthorData();
+      await loadThemeData();
+    }
+)
 
 watch(
     () => currentArticle.value,
@@ -418,15 +430,15 @@ watch(
 </script>
 <style scoped lang="scss">
 
-.subtitle
+.subtitle {
-{
+  color: #999AAA;
-  color:#999AAA;
   margin: 0;
 }
 
 .article-box {
   width: 1500px;
   height: 100%;
+
   .comment {
     min-height: 40rem;
   }

Yi.Bbs.Vue3/src/views/home/components/RecommendTheme/index.vue

@@ -57,7 +57,6 @@ const seeNumLength = ref(props.themeData.seeNum.toString().length);
 
 const handleClickTheme = (id) => {
   router.push(`/article/${id}`);
-  router.go(0);
 };
 </script>