Presumably everyone has encountered the following situation when digging vue: for example, when deleting or adding a record, I hope that the current page can be refreshed or as follows:
At this time, our most direct thinking is to think of the following:
However, if I have tried it, I will find that using vue-router to reroute to the current page, the page is not refreshed, and has no effect at all~ So this method is out!
Below I will sort out several remarkable three methods, you can choose by yourself:
1. Refresh the entire page most directly:
location. reload()
this.$router.go(0)
Both of these can refresh the current page. The disadvantage is that it is equivalent to pressing ctrl+F5 to force a refresh. When the entire page is reloaded, an instant blank page will appear, which is a bad experience.
2. Create a new blank page supplierAllBack.vue, when you click OK, jump to this blank page first, and then jump back immediately
The contents of the blank page supplierAllBack.vue:
Compared with the first method, the blank page will not appear for a moment, but the address bar has a quick switching process, which can be used
3. The provide/inject combination method is the most practical I have tried, and I will use the screenshot of the project to explain to you: First, you need to modify your app.vue
By declaring the reload method to control the display or hiding of the router-view, thereby controlling the reloading of the page, here is defined
isRouterAlive //true or false 来控制
Then inject the reload dependency provided by the App.vue component into the page that needs the current page refresh, and then directly use this.reload to call it.