安裝
Vuejs 1.x
npm install vue-wechat-title@1.0.7 --save
Vuejs 2.x
npm install vue-wechat-title --save
ES6
main.js
Vue.use(require('vue-wechat-title'))
路由定義(只截取一部分)
const routes = [
{
name: 'Home',
path: '/home',
meta: {
title: '首頁(yè)'
},
component: require('../views/Home.vue')
},
{
name: 'Order',
path: '/order',
meta: {
title: '訂單'
},
component: require('../views/Order.vue')
},
{
name: 'UCenter',
path: '/ucenter',
meta: {
title: '用戶(hù)中心'
},
component: require('../views/UCenter.vue')
}
]
// ...
App.vue 建議全局只使用一次該指令 標(biāo)題可用vuex或者router中定義 不要多處使用!!
任意元素中加 v-wechat-title 指令 建議將標(biāo)題放在 route 對(duì)應(yīng)meta對(duì)象的定義中
<div v-wechat-title="$route.meta.title">
<router-view v-wechat-title="$route.meta.title"></router-view>
<div class="home-main" v-wechat-title="$t('m.navheader.home')"> 國(guó)際化
自定義加載的圖片地址 默認(rèn)是 ./favicon.ico 可以是相對(duì)或者絕對(duì)的
<div v-wechat-title="$route.meta.title" img-set="/static/logo.png"></div>