vue中动态设置meta标签和title标签的方法

vue中动态设置meta标签和title标签的方法

1.router.js 路由

{
	path: '/teachers',
	name: 'TDetail',
	component: TDetail,
	meta: {
		title:"教师详情",
		content: 'disable'
    }
},
{
	path: '/article',
	name: 'Article',
	component: Article,
	meta: {
		title: "文章详情",
		content: 'disable-no'
	}
},

main.js

router.beforeEach((to, from, next) => {
    /* 路由发生变化修改页面meta */
    if (to.meta.content) {
        let head = document.getElementsByTagName('head');
        let meta = document.createElement('meta');
        meta.content = to.meta.content;
        head[0].appendChild(meta)
    }

    /* 路由发生变化修改页面title */
    if (to.meta.title) {
        document.title = to.meta.title;
    }
    next()
});