Vue3.x如何設(shè)置瀏覽器動態(tài)Title方法
更新時間：2024年03月08日 11:06:48 作者：小破孩呦
這篇文章主要介紹了Vue3.x如何設(shè)置瀏覽器動態(tài)Title方法,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
使用插件vue-wechat-title來實現(xiàn)
（我是剛升級的vue3.x，在安裝插件的時候遇到了各種問題，后來發(fā)現(xiàn)可能是因為的我node版本太低了，然后就去升級了一下，就好了）
Node版本要求：
Vue CLI 需要 Node.js 8.9 或更高版本 (推薦 8.11.0+)。
1、安裝插件
npm install vue-wechat-title --save
2、在main.js中引用
import VueWechatTitle from 'vue-wechat-title'//動態(tài)修改title Vue.use(VueWechatTitle)
3、在router文件夾下的index.js中增加
如下：
const routes = [
{
path: '/',
name: 'Home',
meta: {
title: '首頁'
},
component: Home
},
{
path: '/about',
name: 'About',
meta: {
title: '關(guān)于'
}
}
]4、在app.vue 中添加 指令 v-wechat-title
<router-view v-wechat-title='$route.meta.title'/>
通過以上步驟即可實現(xiàn)瀏覽器動態(tài)Title切換
效果如下：
總結(jié)
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
vue預(yù)覽 pdf、word、xls、ppt、txt文件的實現(xiàn)方法
這篇文章主要介紹了vue預(yù)覽 pdf、word、xls、ppt、txt文件的實現(xiàn)方法，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要介紹了Vue getter setter，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-04-04
這篇文章主要介紹了淺談Vue響應(yīng)式(數(shù)組變異方法)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-05-05
這篇文章主要介紹了vue之Element-Ui輸入框顯示與隱藏方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04
ant desing vue table 實現(xiàn)可伸縮列的完整例子
最近在使用ant-design-vue做表格時，遇到要做一個可伸縮列表格的需求，在網(wǎng)上一直沒有找到好的方法，于是小編動手自己寫個可以此功能，下面小編把a(bǔ)nt desing vue table 可伸縮列的實現(xiàn)代碼分享到腳本之家平臺供大家參考2021-05-05
這篇文章主要介紹了vue之el-form表單校驗以及常用正則，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-05-05
這篇文章主要介紹了vue組件文檔生成備注詳解，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要來和大家詳細(xì)探討一下Vue2中是如何監(jiān)聽數(shù)組的變化的,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-03-03
小編給大家整理Vue底層實現(xiàn)原理的知識點總結(jié)，如果大家對此有需要，可以學(xué)習(xí)參考下，希望我們整理的內(nèi)容能夠幫助到你。2018-02-02
Vue中Video標(biāo)簽播放解析后短視頻去水印無響應(yīng)解決
這篇文章主要為大家介紹了Vue中使用Video標(biāo)簽播放?＜解析后的短視頻＞去水印視頻無響應(yīng)的解決方式，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-04-04