在项目中,页面切换如果让标题同步动态切换,我是在路由切换完成后 静默加载一个空iframe动态设置title的方式进行~
一、先命令行安装:
npm install vue-wechat-title --save
二、在main.js中引入安装的命令:
Vue.use(require('vue-wechat-title'))
三、路由定义如下:
routes: [
{
path: '/',
name: 'index',
meta: {
title: '首页'
},
component: Index
},
]
四、在app.vue中 建议全局只使用一次该指令 标题可用vuex或者router中定义 不宜多处使用
<!-- 任意元素中加 v-wechat-title 指令 建议将标题放在 route 对应meta对象的定义中 -->
<div v-wechat-title="$route.meta.title"></div>
<!--or-->
<router-view v-wechat-title="$route.meta.title"></router-view>
<!-- 自定义加载的图片地址 默认 ./favicon.ico 相对路径和绝对路径都可以 -->