基本環境配置： webpack + vue2.0 + vue-router +nodeJS

---

進入 router 文件夾底下的index.js文件

首先引入：

import Vue from 'vue' import Router from 'vue-router'

然后在路由里面配置每個路由的地址：

routes: [{ /* （首頁）默認路由地址 */path: '/',name: 'Entrance',component: Entrance,meta: {title: '首頁入口'}},{ /* 修改昵稱 */path: '/modifyName/:nickName',name: 'modifyName',component: modifyName,meta: {title: '修改昵稱'}},{ /* 商品詳情 */path: '/goodsDetail',name: 'goodsDetail',component: goodsDetail,meta: {title: '商品詳情'}},{ /* Not Found 路由，必須是最后一個路由 */path: '*',component: NotFound,meta: {title: '找不到頁面'}}]

在每一個meta里面設置頁面的title名字，最后在遍歷

router.beforeEach((to, from, next) => {/* 路由發生變化修改頁面title */if (to.meta.title) {document.title = to.meta.title}next() })

這樣就為每一個VUE 的頁面添加了title

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的使用vue-router设置每个页面的title的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。