在做toB系统的时候,避免不了表格的一些操作,编辑、删除、新增、复制等,那么在操作完成之后,我们希望能够刷新一下当前表格,并且让表格的页面回到第一页,这个时候可以使用provide和inject来实现

代码如下:

<router-view v-if="isRouterActive"></router-view>
<script lang="ts" setup>
	import { nextTick, provide } from 'vue'
	provide('reload', () => {
   		isRouterActive.value = false
	   	nextTick(() => {
	     	isRouterActive.value = true
	   	})
 	})
</script>

在我们需要进行更新的页面的代码如下:

<script lang="ts" setup>
	import { getList } from '@/api'
	import { inject } from 'vue-demi'
	const reload: any = inject('reload')
	
	// 相应的操作方法
	const operate = () => {
		getList().then((res) => {
			// 请求成功后,reload,即可刷新当前页
			reload()
		})
	}
</script>
Logo

前往低代码交流专区

更多推荐