修改路由跳转导致的侧边导航栏不刷新的问题

src/components/MainMenu/MainMenu.vue

@@ -4,7 +4,7 @@
     <div
       class="menu-item menu-item_first"
       :class="{ 'js-menu-item_active': currentRoute === 0 }"
-      @click="selectPage(0, 'categoryManage')"
+      @click="selectPage(0, '/categoryManage')"
     >
       <div class="menu-item_subject-icon">
         <i class="iconfont">&#xe62b;</i>
@@ -26,7 +26,7 @@
     <div
       class="menu-item menu-item_template"
       :class="{ 'js-menu-item_active': currentRoute === 2 }"
-      @click="selectPage(2, 'userCenter')"
+      @click="selectPage(2, '/userCenter')"
     >
       <div class="menu-item_template-icon">
         <i class="iconfont">&#xe62a;</i>
@@ -40,22 +40,25 @@
 <script>
 let UrlPrefixObj = require("@/config/UrlPrefix");
 export default {
-  data() {
-    return {
-      currentRoute: Number(sessionStorage.getItem("currentRoute")),
-    };
+  computed: {
+    currentRoute() {
+      return this.$store.getters.get_currentRoute;
+    },
   },
-  mounted() {},
   methods: {
+    // 路由切换
     selectPage(idnex, path) {
-      if (idnex === 1) {
-        window.open(UrlPrefixObj.model.CHAIN_BROWSER_URL_PREFIX);
-      } else {
-        if (this.currentRoute === idnex) return;
-        sessionStorage.setItem("currentRoute", idnex);
-        this.currentRoute = idnex;
-        this.$router.push({ path: path });
-      }
+      this.$store
+        .dispatch("selectPage", idnex)
+        .then(() => {
+          if (idnex === 1) {
+            window.open(UrlPrefixObj.model.CHAIN_BROWSER_URL_PREFIX);
+          } else {
+            if (this.$route.path === path) return;
+            this.$router.push({ path: path });
+          }
+        })
+        .catch(() => {});
     },
   },
 };

src/components/Uncertified.vue

@@ -12,25 +12,29 @@
         <button class="g-btn_primary btn_confirm" @click="$emit('confirm')">
           取消
         </button>
-        <button class="g-btn_primary btn_cancel" @click="$emit('cancel')">
-          去认证
-        </button>
+        <button class="g-btn_primary btn_cancel" @click="cancel">去认证</button>
       </div>
     </div>
   </common-dialog>
 </template>
 
-<script lang="ts">
-import { Component, Prop, Vue } from "vue-property-decorator";
+<script>
 import CommonDialog from "@/components/CommonDialog.vue";
-@Component({
+export default {
   components: {
     CommonDialog,
   },
-})
-export default class Uncertified extends Vue {
-  @Prop() tip!: string;
-}
+  methods: {
+    cancel() {
+      this.$store
+        .dispatch("selectPage", 2)
+        .then(() => {
+          this.$emit("cancel");
+        })
+        .catch(() => {});
+    },
+  },
+};
 </script>
 
 <style scoped>
@@ -41,13 +45,13 @@ export default class Uncertified extends Vue {
 }
 
 .g-btn_primary {
-    border: none;
-    background: #5779F4;
-    font-size: 14px;
-    color: #fff;
-    outline: none;
-    cursor: pointer;
-    border-radius: 8px;
+  border: none;
+  background: #5779f4;
+  font-size: 14px;
+  color: #fff;
+  outline: none;
+  cursor: pointer;
+  border-radius: 8px;
 }
 .title {
   margin: 0;

src/components/category/Index.vue

@@ -69,7 +69,6 @@
 </template>
 
 <script lang="ts">
-import { GO_URLS } from "@/config/URLS";
 import { Component, Vue, Watch } from "vue-property-decorator";
 // 模板管理部分
 import TemplateManage from "./TemplateManage.vue";

src/store/actions.ts

-import {StateTypes} from "./types";
-import {ActionTree} from "vuex";
+import { StateTypes } from "./types";
+import { ActionTree } from "vuex";
 
 const actions: ActionTree<StateTypes, any> = {
-
+    selectPage({ commit }, idnex) {
+        return new Promise<void>((resolve) => {
+            sessionStorage.setItem("currentRoute", idnex);
+            commit('setCurrentRoute', idnex)
+            resolve()
+        })
+    },
 };
 
 export default actions;

src/store/getters.ts

@@ -4,6 +4,7 @@ import { GetterTree } from "vuex";
 const getters: GetterTree<StateTypes, any> = {
     get_templateType: state => state.templateType,
     get_templateData: state => state.templateData,
+    get_currentRoute: state => state.currentRoute,
 };
 
 export default getters;

src/store/mutations.ts

@@ -57,7 +57,9 @@ const mutations: MutationTree<StateTypes> = {
   setTemplateData(state, data) {
     state.templateData = data
   },
-  // templateData
+  setCurrentRoute: (state, currentRoute) => {
+    state.currentRoute = currentRoute
+  },
 };
 
 export default mutations;

src/store/state.ts

@@ -16,7 +16,8 @@ const state: StateTypes = {
   theAnchor: -1,
   chainStatus: '',
   templateType: 0,
-  templateData: {}
+  templateData: {},
+  currentRoute: Number(sessionStorage.getItem("currentRoute")) || 0
 };
 
 export default state;

src/store/types.ts

@@ -15,6 +15,7 @@ export interface StateTypes {
   theAnchor: number, //用于记录增量列表的展开
   chainStatus: string,
   templateType: number,
-  templateData:any
+  templateData: any,
+  currentRoute: number
 }