动态修改router里的meta属性;

router.js

{

path:'/detail',

meta:{

title:'详情',

isnavbar:false,

istabbar:false

},

components:()=>import('xxx.vue')

}

路由配置

默认route.js的meta里的配置;

App.vue

这是在app.vue页面，统一的一个头部和底部导航

detail.vue

export default {

name:'detail',

data(){

return {

title:''

}

},

methods:{

getDetail(){

axios.get(xxxx).

then(res=>{

this.title = res.data.title;

})

}

},

create(){

this.getDetail()

},

mounted(){

this.$route.meta.title = this.title

}

}

这里说一下，进入detail页面后navbar的title默认是'详情'，发送数据请求，获取到后端返回的title，保存到data里，然后在修改route.meta.title 为 this.title

这里在vue开发工具里能看到route.meta.title改变了，但是页面navbar里的title并没有更新。~ 求解！~