动态更换title
2018-11-20 本文已影响0人
Augenstern___
vue2.x用法
npm install vue-wechat-title;
之后在main.js全局入口处,引入wechat-title
Vue.use(require('vue-wechat-title'));
然后在router路由中
export default new Router({
routes: [
{
path: '/',
redirect: 'index',
},
{
path: '/index',
name: 'Index',
component: Index,
meta: { title: '首页' },
},
{
path: '/project',
name: 'Project',
component: Project,
meta: { title: '活动项目' },
},
{
path: '/service',
name: 'Service',
component: Service,
meta: { title: '服务' },
},
{
path: '/interspace',
name: 'Interspace',
component: Interspace,
meta: { title: '空间' },
},
{
path: '/discover',
name: 'Discover',
component: Discover,
meta: { title: '发现' },
},
{
path: '/my',
name: 'My',
component: My,
meta: { title: '我的' },
},
]}
)
之后在各个组建中随便一个标签中都可写入
<div v-wechat-title="$route.meta.title"></div>
or/
<router-view v-wechat-title="$route.meta.title"></router-view>
想要动态的改变title值,可以这样写
<div v-wechat-title="$route.meta.title={data.title}"></div>