最近在写后台管理系统时，遇到一个需求：

关闭当前页面，然后跳转到指定页面。

具体实现方法如下：

1.tabsView.vue文件中添加bus文件，并实现跨组件之间的监听

1.1 引入bus文件

import Bus from '@/utils/bus';

bus文件内容如下：

import Vue from 'vue'
const Bus = new Vue();
export default Bus;

1.2 在mounted中添加如下代码

mounted() {
  Bus.$on('closeCurrentPage', (data) => {
    this.remove(this.$route.fullPath);
  });
},

1.3 remove方法如下：

methods:{
	remove(key, next) {
      if (this.pageList.length === 1) {
        return this.$message.warning(this.$t('warn'));
      }
      //清除缓存
      let index = this.pageList.findIndex((item) => item.fullPath === key);
      this.clearCaches = this.pageList
        .splice(index, 1)
        .map((page) => page.cachedKey);
      if (next) {
        this.$router.push(next);
      } else if (key === this.activePage) {
        index =
          index >= this.pageList.length ? this.pageList.length - 1 : index;
        this.activePage = this.pageList[index].fullPath;
        this.$router.push(this.activePage);
      }
    },
}

2.使用Bus.$emit('closeToPage', path)触发方法

2.1 引入bus文件

import Bus from '@/utils/bus';

2.2 Bus.$emit('closeToPage', path)，path就是关闭当前路由后跳转的路由

完成！！！多多积累，多多收获！！！