前言:
vue中我们经常见的是随着切换不同的页面可以修改页面上的meta.title,但是还有另一种情况是我们要在组件内部改动他的提示信息,比如:我们封装了一个详情组件,然后需要每次进来的时候获取后台数据,然后根据数据来修改我们页面上的标题信息
实现方法:
1 核心代码:修改+刷新
// 动态改title
this.$route.meta.title = datas.name
//刷新
let query = this.$route.query
this.$router.replace({
query: {
temp: Date.now(), //必有,必须第一个
audio_id: query.audio_id,//其他参数
}
})
2 全部代码:放在请求后台成功以后来修改
this.$api.homeWork.getArticleDetail(id, str).then(res => {
if (res.data.code === 13200) {
let datas = res.data.data
// 动态改title
this.$route.meta.title = datas.name
//刷新
let query = this.$route.query
this.$router.replace({
query: {
temp: Date.now(), //必有
audio_id: query.audio_id,
source: 'homework',
subjectAlias: query.subjectAlias,
articleTit: query.articleTit
}
})
this.showAudio = false
this.$nextTick(() => {
this.mindDetail = datas
this.songInfo.title = datas.audios[0].name
this.songInfo.src = datas.audios[0].file_url
this.showAudio = true
})
}
})