Vue3.0页面title设置

2020年7月27号成功。

1. 安装依赖vue-wechat-title

npm i vue-wechat-title

2. 在main.js中引入依赖

import VueWechatTitle from 'vue-wechat-title';
Vue.use(VueWechatTitle)

3. 在main.js中为路由写上一个meta.title属性

let router = new VueRouter({
	routes:[
	{
		path: '/',
		component: home,
		meta:{
			title: '首页'
		}
	}
]

4. 最后为App.vue文件中的<div>标签添加一个属性v-wechat-title

<template>
  <div v-wechat-title="$route.meta.title">
    <router-view></router-view>
  </div>
</template>

ok大功告成！以后访问哪个路由，页面的title都会变成该路由的meta.title属性值。