只提供样例代码和思路
1.通过再次请求数据刷新(推荐)
uploadBtn() {
request({
url:'/partyMember/update.dao',
data:{
id:1,
partyMemberCount:this.partyMemberChange.partyMemberCount,
peopleCount:this.partyMemberChange.peopleCount,
}
}).then(res => {
if(res.data.code === 200){
//请求成功后再次请求刷新数据
request({
url:'/partyMember/querydata.dao',
method:'get',
params:{
id:1
},
}).then(res => {
if(res.data.code === 200){
this.partyMember.peopleCount = res.data.data.peopleCount;
this.partyMember.partyMemberCount = res.data.data.partyMemberCount;
}else {
console.log('党员人数信息请求错误,数值显示为0')
}
}).catch(err => {
console.log('网络或请求错误')
})
console.log('修改成功')
}else {
console.log('修改失败请重试')
}
}).catch(err => {
console.log('网络或请求错误')
}
},
2.通过刷新组件刷新
这种方法本质上也是再次请求数据
(1)key刷新(最好用的)
提供思路
<component :key="key"></component>//要刷新的组件
<button @click="key+1">点击后组件刷新</button>>//key改变,组件刷新
data(){
return{
key:1
}
}
当然如果key不在同一组件需要传参的话,可以吧key放入vux中,改变this.$store.state.key就行了
(2)$forceupdate刷新
别用,超级难用.
(3)v-if刷新
提供思路
<component v-if="isShow" :key="key"></component>//要刷新的组件
<button @click="change">点击后组件刷新</button>>//isShow改变两次来刷新组件
data(){
return{
isShow:true
}
},
methods:{
change(){
this.isShow = !this.isShow
this.isShow = !this.isShow
}
}