情景:
- 比如在删除或者增加一条记录的时候希望当前页面可以重新刷新
- 请求接口中直接将数组结果取第0个数组或者第n个数组给变量,会报错 0 的错误,此时多次刷新即可
方法一、这种方法简单快捷,但是页面会有空白瞬间,体验不够好
this.$router.go(0);
location. reload()
_getquery(){ getquery( {product_id: this.product_id}, {Authorization: this.access_token} ).then( (res)=>{ if(res === undefined || res === ''){ this.reload(); // this.$router.go(0) }else{ //请求到数据
this.product_content = res.answer[0].content.body; } })
}
方法二、
- 在App.vue 文件中,router-view中加代码:v-if="isRouterAlive"
<template>
<div id="app">
<router-view v-if="isRouterAlive"/>
</div>
</template>
2. 在App.vue文件中,在script中加入如下代码:
<script> export default { name: 'app', provide (){ return { reload: this.reload } }, data () { return { isRouterAlive : true } }, methods: { reload () { this.isRouterAlive = false; this.$nextTick(function () { this.isRouterAlive = true; }) } }, components: { } } </script>
3.在需要刷新的vue页面中 注入依赖 :inject: ['reload'],
4.在需要刷新的vue页面中 调用 : this.reload();
_getquery(){ getquery( {product_id: this.product_id}, {Authorization: this.access_token} ).then( (res)=>{ if(res === undefined || res === ''){ this.reload(); // this.$router.go(0) }else{ //请求到数据
this.product_content = res.answer[0].content.body; } }) }