msyj-admin-org/src/modules/admin/views/Home.vue

<template>
  <div class="home admin-home">
    <div class="home-header">
      <view-header>
        <div class="home-navs" slot="info">
          <ul>
            <li
              :class="{ act: curNav.name === nav.name }"
              v-for="(nav, index) in navs"
              :key="index"
              @click="switchNav(nav)"
            >
              <span class="nav-item-cont">{{ nav.title }}</span>
            </li>
          </ul>
        </div>
      </view-header>
    </div>

    <div class="home-body">
      <div class="home-main">
        <router-view />

        <view-footer></view-footer>
      </div>
    </div>
  </div>
</template>

<script>
import { navs } from "../router";

export default {
  name: "admin-home",
  data() {
    return {
      navs,
      curNav: {}
    };
  },
  mounted() {
    this.actCurNav(this.$route);
  },
  methods: {
    switchNav(item) {
      if (item.name === this.curNav.name) return;

      this.curNav = item;
      this.$router.push({
        name: item.name,
        params: {
          workId: this.$route.params.workId
        }
      });
    },
    actCurNav(router) {
      this.curNav = this.navs.find(item => item.name === router.name);
    }
  }
};
</script>