需求场景：
微信后台配置不同的商户id，请求接口获取商户信息（名称、头像等）
1、安装插件
#yarn add vue-wechat-title
#npm i vue-wechat-title
2、main.js文件
Vue.use(require('vue-wechat-title'))
3、App.vue文件
<template><div id="app"><div v-wechat-title="$route.meta.title"></div><keep-alive><router-view v-if="$route.meta.keepAlive"></router-view></keep-alive><router-view v-if="!$route.meta.keepAlive"></router-view></div></template>
4、router.js文件
{path: '/coupon',component: coupon,meta: { title: '惠联生花', keepAlive: true, wechat_auth: true, alipay_auth: true }},{path: '/coupon_product_detail',component: coupon_product_detail,meta: { title: '优惠券详情', wechat_auth: true, alipay_auth: true }}
5、根据接口返回动态修改title
view层：
<!-- 给想要修改title的页面添加 v-wechat-title --><div id="coupon_list" @scroll="scrollToTop" v-wechat-title="titleName"></div>
methods（数据处理）：
// 获取商户id等参数created(){if (this.$route.query.type){this.type = this.$route.query.type;this.targetId = this.$route.query.targetId;}this.getTitle()},//请求接口返回商户名称getTitle(){getTitle(this.type,this.targetId).then( res => {this.titleName = res.data.name?res.data.name:"爆品福利";})}
接口返回：
抛出问题：（返回后之前的title被替换）
爆品福利列表页（惠联生花） => 进详情（优惠券详情） =>返回列表页（优惠券详情）
注:
1. 首先进入爆品福利列表页，title显示惠联生花
2. 进入详情页，title显示优惠券详情
3. 返回爆品福利列表页，title依然显示优惠券详情
beforeRouteLeave(to, from, next){this.titleName = document.title;next()},beforeRouteEnter(to, from, next){next(vm => {document.title = vm.titleName;})}
beforeRouteEnter(to, from, next)：进入路由之前执行的函数,写在组件里可根据路由进行页面判断或传值。
beforeRouteLeave(to, from, next)：离开路由之前执行的函数,可用于页面的反向传值，页面跳转。
console.log(to)
