Vue中使用Vue.router修改单页面的标题

Vue中使用Vue.router修改单页面的标题

在页面发生路由改变的时候，统一设置。通过使用vue-router提供的导航钩子函数beforeEach和afterEach中的 beforeEach

const Routers = {
	{
		path:'/index',
		meta:{
			title:'首页'
		}，
		component:(resolve) => require(['./views/index.vue'],resolve)
	},
};
	
const router = new VueRouter(RouterConfig);
router.beforeEach = ((to,from,next)) => {
	window.document.title = to.meta.title;
	next();
});

• to 即将要进入的目标的路由对象
• from 当前导航即将要离开的路由对象
• next 调用该方法后，才能进入下一个钩子