[vue]vue-router配置title

【vue】vue-router配置title

笔者最近公司项目需要使用到vue-router，但是发现没办法配置title。网上查阅了一下，发现有些方法不能用，比如：

router.map({
    '/pathA': {
        name: 'path-a',
        title: 'title path',
        //
    }
});

router.afterEach(function (transition) {
    if (transition.to.title) {
        document.title = transition.to.title;
    }
});

通过console.log发现没有to这个变量的存在，故自己实现了一个。

实现思路：通过meta元信息来实现。代码如下：

var routerValue = [
    {
        path:"/about",
        component: about,
        meta: {
            title: "关于"
        }        
    },
    {
        path:"/login",
        component: login,
        meta: {
            title: "登录"
        } 
    }
    ]

    var router = new VueRouter({
        routes: routerValue,
    })

router.afterEach((transition) => {
    document.title=transition.meta.title
}