SessionStorage is used to store the route path. When refreshing the page again, the route path of the current page is obtained

The HTML code

<ul class="menu">
  <li v-for="(menu, index) in menuRouters" :key="index"
      @click="changeMenu(menu)"
      :class="{active : select === menu.path}">{{menu.name}}</li>
</ul>
Copy the code

Js code

Data () {return {// menu status select: '/', // menu data: [{name: 'home ', path: '/',}, {name:' about me ', path: ' '/About', }, ], } }, mounted() { this.select = sessionStorage.getItem('select') || '/' }, methods: @param {Object} menu Single menu information */ changeMenu(menu) {this.select = menu.path sessionStorage.setItem('select', this.select) this.$router.push({ path: menu.path, }) }, },Copy the code

router.js

Export default new Router({mode: 'history', base: process.env.BASE_URL, routes: [// home {path: '/', Component: () = > import (' @ / views/modules/home/Main vue '), I {}, / / About path: '/ About', the component: () => import('@/views/modules/about/Main.vue'), }, ], })Copy the code