業(yè)務(wù)場(chǎng)景
在管理后臺(tái)執(zhí)行完增刪改查的操作之后,需要重新加載頁面刷新數(shù)據(jù)以便頁面數(shù)據(jù)的更新
實(shí)現(xiàn)原理
就是通過控制router-view 的顯示與隱藏,來重渲染路由區(qū)域,重而達(dá)到頁面刷新的效果,show -> flase -> show
具體代碼
1.首先在我們的根組件APP.vue里面,寫入刷新方法,路由初始狀態(tài)是顯示的
<template>
<div >
<el-container class="wrap">
<el-header>
<headers></headers>
</el-header>
<el-main>
//if判斷狀態(tài)
<router-view v-if="isRouterAlive"></router-view>
</el-main>
</el-container>
</div>
</template>
<script>
import headers from "../components/headers.vue"
export default {
//刷新方法
provide(){
return{
reload:this.reload
}
},
data(){
return{
isRouterAlive:true
}
},
methods:{
//解決頁面刷新,重新渲染數(shù)據(jù)
reload(){
this.isRouterAlive=false;
this.$nextTick(()=>{
this.isRouterAlive=true
})
}
},
};
</script>
?2.在需要調(diào)用的子組件中引用,需要先用inject先注入reload方法,然后在需要的地方調(diào)用this.reload()文章來源:http://www.zghlxwxcb.cn/news/detail-503154.html
文章來源地址http://www.zghlxwxcb.cn/news/detail-503154.html
到了這里,關(guān)于Vue強(qiáng)制刷新頁面重新加載數(shù)據(jù)方法的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!