未古其人

目录

同页面跳转时的数据刷新问题

之前在做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() // 这里调用
		},
	}