一級(jí)路由跳轉(zhuǎn)title變化

index.js里的路由配置規(guī)則

image

像這樣首頁跳轉(zhuǎn)到登錄同是一級(jí)路由跳轉(zhuǎn)時(shí)改變頁面的title標(biāo)簽，只需要在index.js中加入下面這段代碼

router.beforeEach((to,from,next) => {
    document.title = to.matched[0].meta.title
    next()
})

二級(jí)路由跳轉(zhuǎn)改變title

例如這種跳轉(zhuǎn)到子路由下時(shí)，上面的方法就無法實(shí)現(xiàn)了，這時(shí)候需要使用第二種方式

image

引入第三方插件vue-wechat-title

npm install vue-wechat-title --save

在main.js中引入并使用

import vueWechatTitle from 'vue-wechat-title'
Vue.use(vueWechatTitle)

最后修改App.vue頁面中的router-view

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

解決！！

image