Vue.js（二）—— 使用vue-router设置每个页面的title

1.引入vue-router

[code]import Vue from 'vue'
import Router from 'vue-router'

2. 在router/index.js文件中配置每个页面的title：

[code]export default new Router({
routes: [{
path: '/',
name: 'homepage',
component: homepage,
meta: {
title: '首页'
}
}, {
path: '/voucher_list',
name: 'vList',
component: vList,
meta: {
title: '优惠券列表'
}
}, {
path: '/voucher_select',
name: 'vSelect',
component: vSelect,
meta: {
title: '选择优惠券'
}
}]
})

3. 在main.js文件中遍历，使之生效

[code]// 以下代码需要写在main.js里面

router.beforeEach((to, from, next) => {
/* 路由发生变化的时候修改页面title */
if (to.meta.title) {
document.title = to.meta.title
}
next()
})