vue h5标题动态修改
1、安装相关插件
npm install vue-wechat-title --save
或
npm install vue-wechat-title -S
2、在main.js中引用
// vue单页面应用中动态修改title
import VueWechatTitle from 'vue-wechat-title'
Vue.use(VueWechatTitle)
3、在路由router文件index.js中给每个路由添加title
{
path: '/chooseNumberList',
name: 'ChooseNumberList',
component: () => import('@/views/chooseToNetwork/chooseNumberList'),
meta: { title: '选号入网', keepAlive: false },
},
{
path: '/materialsList',
name: 'MaterialsList',
component: () => import('@/views/materialsMall/materialsList'),
meta: { title: '激活明细', keepAlive: false },
},
4、在aap.vue中修改router-view组件
<template>
<div id="app">
<!-- <router-view /> -->
<router-view v-wechat-title='$route.meta.title'></router-view>
</div>
</template>
<script>
export default {
name: 'App'
}
</script>