Vue单页面应用修改title

原创于 2018-06-20 11:15:39 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#Vue

Vue 专栏收录该内容

34 篇文章

订阅专栏

Vue单页面应用修改title，两种方法

在router/index.js中写路由添加title

 path: '/',
 name: 'Index',
 component: Index,
 meta:{
   title:'款项管理'
 },

//修改title 1.
router.beforeEach((to, from, next) => {
  document.title = to.meta.title
  next()
})
//修改title 2.
Vue.directive('title',{
  inserted:(el,binding)=>{
    document.title = binding.value;
  },
  update:(el,binding)=>{
    document.title = binding.value;
  }
})

第二种方法需要在app.vue中

<router-view v-title="$route.meta.title"></router-view>