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)文章
element-ui和vue表單(對話框)驗證提示語(殘留)清除操作
這篇文章主要介紹了element-ui和vue表單(對話框)驗證提示語(殘留)清除操作，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-09-09
詳解element-ui動態(tài)限定的日期范圍選擇器代碼片段
這篇文章主要介紹了element-ui動態(tài)限定的日期范圍選擇器代碼片段，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-07-07
這篇文章主要介紹了三種使用icon的方案，分別是element-icon、svg-icon、@iconify/vue，三種方案通過代碼示例介紹的非常詳細(xì),需要的朋友可以參考下2023-07-07
Vue2?與?Vue3?的數(shù)據(jù)綁定原理及實現(xiàn)
這篇文章主要介紹了Vue2與Vue3的數(shù)據(jù)綁定原理及實現(xiàn)，數(shù)據(jù)綁定是一種把用戶界面元素的屬性綁定到特定對象上面并使其同步的機(jī)制，使開發(fā)人員免于編寫同步視圖模型和視圖的邏輯2022-09-09
vue使用pdf-dist實現(xiàn)pdf預(yù)覽以及水印添加
這篇文章主要為大家詳細(xì)介紹了vue如何使用pdf-dist實現(xiàn)pdf預(yù)覽以及水印添加的功能，文中的示例代碼講解詳細(xì)，感興趣的小伙伴可以跟隨小編一起學(xué)習(xí)一下2023-10-10
應(yīng)用會對用戶的操作進(jìn)行反饋，就叫響應(yīng)式，數(shù)據(jù)變化會實時改變UI，就叫數(shù)據(jù)響應(yīng)式，修改Vue實例中的數(shù)據(jù)時，視圖會重新渲染，就是Vue的數(shù)據(jù)響應(yīng)式2022-05-05
這篇文章主要介紹了vue中如何去掉空格的方法實現(xiàn)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-11-11
今天小編就為大家分享一篇關(guān)于highCharts提示框中顯示當(dāng)前時間的方法，小編覺得內(nèi)容挺不錯的，現(xiàn)在分享給大家，具有很好的參考價值，需要的朋友一起跟隨小編來看看吧2019-01-01
表格Table實現(xiàn)前端全選所有功能方案示例(包含非當(dāng)前頁)
這篇文章主要為大家介紹了表格Table實現(xiàn)前端全選所有功能,包括非當(dāng)前頁的方案示例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2024-02-02
vue項目index.html中使用環(huán)境變量的代碼示例
在Vue3中使用環(huán)境變量的方式與Vue2基本相同,下面這篇文章主要給大家介紹了關(guān)于vue項目index.html中使用環(huán)境變量的相關(guān)資料,文中通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-02-02