vue2 單頁面如何設定網頁title

冰揚發表於2017-11-08
Vue網頁

推薦使用vue-wechat-title外掛

  • 下載安裝外掛依賴
npm install vue-wechat-title --save
  • 在main.js中引入外掛
import VueWechatTitle from `vue-wechat-title`
Vue.use(VueWechatTitle)
  • 在路由檔案 index.js中給每個路由新增title
 routes: [{
    path: `/`,
    name: `index`,
    component: index,
    meta:{
        title:`首頁`  // 標題設定在這裡
    }
  },{
    path:`/detail`,
    name:`detail`,
    component:detail,
    meta:{
        title:`詳情頁` // 標題設定在這裡
    }
  }]
  • 在app.vue中修改router-view元件
<router-view v-wechat-title=`$route.meta.title`></router-view>
  • 重啟試試，可以了

相關文章