前端框架如Vue、React等都是單頁面的應用,也就是說整個web站點其實都是一個index頁面,所謂的頁面跳轉都是替換index.html里邊的內容,而頁面的title是在每個頁面初始化的時候才設置一次。對于現在的前端框架,傳統的每個頁面設置title標簽的做法是不行的。
推薦使用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>
重啟試試,可以了
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持武林網。
新聞熱點
疑難解答