之前在做elementui的项目,一些新增,编辑,删除等操作后,需要刷新当前页面或者表格,看官方文档没找到合适的方法,之前是直接重新再调一遍后台接口进行数据的刷新,今天发现一个不错的方法,来记录一下
记载路由的 vue 文件中配置入下
<template>
<router-view v-if="isRouterAlive"></router-view>
</template>
<script>
export default {
provide(){
return {
reload: this.reload
}
},
data(){
return {
isRouterAlive:true
}
},
methods:{
reload(){
this.isRouterAlive=false
this.$nextTick(()=>this.isRouterAlive=true)
}
}
}
</script>
要使用的页面中调用如下
export default {
inject:['reload'],
data() {
return {}
},
methods:{
onDetail (id) {
this.$router.push({
name: 'same-page-detail',
query: {
id: id
}
})
this.reload() // 这里调用
},
}