前端vue2.6：Vue应用项目中如何打开新窗口并设置新title

打开新窗口

1. let href = this.$router.resolve({name: '', params: {}}) window.open(href.href, '_blank');

1. 举例如下：test.vue

    <template>
     <el-button @click="test"></el-button>
    </template>
    <script>
        methods:{
                  test(){
                   let routeData = this.$router.resolve({
                     name: "test",
                  });
                   window.open(routeData.href, '_blank');
                 },
        }
    </script>
   

设置新的title：router/index.js

2. router.afterEach路由拦截，重新配置 document.title

2.在路由设置相关信息

import Vue from 'vue';
import Router from 'vue-router';
import axios from "axios";
import qs from "qs";
Vue.use(Router);

const router= new Router({
    routes: [
      
        {
            path: '/test',
            name:'test',
            redirect: '/customerPage'
        },
         {
                path: '/customerPage',
                name:"customerPage",
                component: resolve => require(['../components/page/customerPage/customerPage.vue'], resolve),
                meta: { resourceName: '互联管理',title:互联管理 ,requireAuth: true }
            },
       
        {
            path: '*',
            redirect: '/404'
        }
    ]
})
//使用钩子函数对路由进行权限跳转

 router.afterEach((to,from)=>{
     console.log(to);
     if(to.meta.title){
         document.title = to.meta.title;
     }

 })
export default router;