Vue實現(xiàn)頁面的局部刷新(router-view頁面刷新)
更新時間:2021年12月30日 16:12:40 作者:小城聽風雨
本文主要介紹了Vue實現(xiàn)頁面的局部刷新(router-view頁面刷新),文中通過示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
利用Vue里面的
provide+inject
組合
首先需要修改App.vue。
<template> <!-- 公司管理 --> <div class="companyManage"> <router-view v-if="isRouterAlive"></router-view> </div> </template> <script> export default { name: "companyManage", watch: {}, provide() { return { reload:this.reload } }, data() { return { isRouterAlive:true }; }, methods: { reload() { this.isRouterAlive = false; this.$nextTick( () => { this.isRouterAlive = true; }) } }, mounted() {} }; </script> <style scoped> .companyManage { width: 100%; height: 100%; position: relative; background: #fff; } </style>
2. 到需要刷新的頁面進行引用,使用inject導入引用reload,然后直接調用即可。
inject:["reload"], this.reload();
到此這篇關于Vue實現(xiàn)頁面的局部刷新(router-view頁面刷新)的文章就介紹到這了,更多相關Vue 頁面局部刷新內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家!
相關文章
vuex存儲復雜參數(shù)(如對象數(shù)組等)刷新數(shù)據(jù)丟失的解決方法
今天小編就為大家分享一篇vuex存儲復雜參數(shù)(如對象數(shù)組等)刷新數(shù)據(jù)丟失的解決方法。具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11