業務場景:在管理後台,在執行完,增,刪,改,操作的時候。我們需要重新整理一下頁面,過載資料。在jq中我們會用到location.reload()方法,重新整理頁面;在vue中,這裡需要用到乙個 provide / inject 這對用例。(其他方法:this.$router.go(0),會強制重新整理,出現空白頁面體驗不好)
這對選項需要一起使用,以允許乙個祖先元件向其所有子孫後代注入乙個依賴,不論元件層次有多深,並在起上下游關係成立的時間裡始終生效。
實現原理就是通過控制router-view 的顯示與隱藏,來重渲染路由區域,重而達到頁面重新整理的效果,show -> flase -> show
具體**如下:
router-view> 在isrouteralive 為true的地方 使用重新整理 ,然後在其他元件或者頁面中呼叫相應方法就行
2、然後在子元件中引用
3、執行完相應操作之後,呼叫reload方法
Vue 重新整理當前頁面
1.場景 在處理列表時,常常有刪除一條資料或者新增資料之後需要重新重新整理當前頁面的需求。2.遇到的問題 1.用vue router重新路由到當前頁面,頁面是不進行重新整理的 3.解決方法 provide inject 組合 作用 允許乙個祖先元件向其所有子孫後代注入乙個依賴,不論元件層次有多深,並...
vue專案重新整理當前頁面
有時候我們在vue專案頁面做了一些操作,需要重新整理一下頁面。this.router.go 0 這種方法雖然 很少,只有一行,但是體驗很差。頁面會一瞬間的白屏,體驗不是很好 用vue router重新路由到當前頁面,頁面是不進行重新整理的。location.reload 這種也是一樣,畫面一閃,體驗...
vue專案重新整理當前頁面
原理 允許乙個祖先元件向其所有子孫後代注入乙個依賴,不論元件層次有多深,並在起上下游關係成立的時間裡始終生效 export default provide return reload this.reload data function return isrouteralive true method...