vue項目如何刷新當前頁面的方法
更新時間：2018年05月18日 16:41:06 作者：敲代碼的小老頭
這篇文章主要介紹了vue項目如何刷新當前頁面的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
1.場景
在處理列表時，常常有刪除一條數(shù)據(jù)或者新增數(shù)據(jù)之后需要重新刷新當前頁面的需求。
2.遇到的問題
1. 用vue-router重新路由到當前頁面，頁面是不進行刷新的
2.采用window.reload()，或者router.go(0)刷新時，整個瀏覽器進行了重新加載，閃爍，體驗不好
3.解決方法
provide / inject組合
作用：允許一個祖先組件向其所有子孫后代注入一個依賴，不論組件層次有多深，并在起上下游關系成立的時間里始終生效。
App.vue:
聲明reload方法，控制router-view的顯示或隱藏，從而控制頁面的再次加載
tableList.vue:
在頁面注入App.vue組件提供（provide）的 reload 依賴，在邏輯完成之后（刪除或添加...）,直接this.reload()調(diào)用，即可刷新當前頁面。
4.provide / inject 用法
provide：選項應該是一個對象或返回一個對象的函數(shù)。該對象包含可注入其子孫的屬性。
inject：一個字符串數(shù)組，或一個對象，對象的 key 是本地的綁定名
提示：provide和inject綁定并不是可響應的。這是刻意為之的。如果你傳入了一個可監(jiān)聽的對象，那么其對象的屬性還是可響應的。
以上就是本文的全部內(nèi)容，希望對大家的學習有所幫助，也希望大家多多支持腳本之家。
相關文章
本文主要探討了 Vue 3 中父子組件之間的通信方式,包括父傳子,通過props傳遞數(shù)據(jù)和方法；子傳父,用emit觸發(fā)自定義事件并傳遞數(shù)據(jù)；還介紹了使用ref直接操作子組件實例,借助defineExpose暴露子組件的屬性和方法給父組件,需要的朋友可以參考下2025-01-01
使用echarts柱狀圖實現(xiàn)select下拉刷新數(shù)據(jù)
這篇文章主要介紹了使用echarts柱狀圖實現(xiàn)select下拉刷新數(shù)據(jù)，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
這篇文章主要介紹了vue自定義全局組件(自定義插件)的用法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-01-01
今天小編就為大家分享一篇淺談vuex的基本用法和mapaction傳值問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11
這篇文章主要介紹了element-ui?table表格底部合計自定義配置過程,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10
本文主要介紹了關于vue.js中this.$emit的理解使用，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2022-08-08
這篇文章主要介紹了關于vue中輸入框的使用場景總結(jié)，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-05-05
這篇文章主要介紹了簡述vue狀態(tài)管理模式之vuex，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-08-08
這篇文章主要介紹了關于Vue新搭檔TypeScript快速入門實踐，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09
Vue?Electron實現(xiàn)輸入法自動刷字數(shù)功能詳解
這篇文章主要介紹了Vue?Electron實現(xiàn)輸入法自動刷字數(shù)功能，文中的示例代碼講解詳細，對我們學習C#有一定的幫助，感興趣的小伙伴可以跟隨小編一起了解一下2022-12-12