vue中按鈕操作完刷新頁面的實(shí)現(xiàn)
更新時(shí)間：2022年07月06日 11:54:52 作者：醉夢洛
這篇文章主要介紹了vue中按鈕操作完刷新頁面的實(shí)現(xiàn)方式，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
vue按鈕操作完刷新頁面
首先從子組件和父組件角度去寫這個(gè)東西，簡言之就是在父組件中實(shí)現(xiàn)這個(gè)刷新功能方法，然后在子組件中進(jìn)行綁定并進(jìn)行監(jiān)聽就好了啊
1.父組件中實(shí)現(xiàn)
① 圖示部分：
個(gè)人建議這個(gè)作為父組件，肯定一般是放在列表中的，即把列表頁面作為父組件的歸屬地
② 代碼部分：
method方法中部分
refresh () {
this.reload()
}將reload進(jìn)行注入
inject: ['reload'],
2.子組件綁定
① 子組件進(jìn)行綁定
在父組件中引用子組件頁面的地方進(jìn)行綁定
如圖：
綁定腳本：
@refresh="refresh"
② 單獨(dú)去子組件頁面處理成功的地方去監(jiān)聽
圖示：比如就以這個(gè)頁面為例子
進(jìn)入子頁面：
在子頁面組件中處理成功后進(jìn)行監(jiān)聽父組件中刷新方法，以上設(shè)置完就ok了
點(diǎn)擊按鈕后自動刷新頁面
在按鈕點(diǎn)擊事件中添加
window.location.reload();
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了Vue如何實(shí)現(xiàn)多頁面配置以及打包方式，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10
這篇文章主要介紹了vue引用外部JS的兩種種方案,本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-01-01
Vue實(shí)現(xiàn)boradcast和dispatch的示例
這篇文章主要介紹了Vue實(shí)現(xiàn)boradcast和dispatch的示例，幫助大家更好的理解和使用vue，感興趣的朋友可以了解下2020-11-11
vue3?使用?vue3-video-play實(shí)現(xiàn)在線視頻播放
這篇文章主要介紹了vue3?使用?vue3-video-play?進(jìn)行在線視頻播放,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-06-06
這篇文章主要介紹了vue data中如何獲取使用store中的變量，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-03-03
這篇文章主要介紹了vue中的slot封裝組件彈窗，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-05-05
Ant?Design?Vue?Pagination分頁組件的封裝與使用
這篇文章主要介紹了Ant?Design?Vue?Pagination分頁組件的封裝與使用方式，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04
websocket實(shí)現(xiàn)的全雙工通信,真真太香了,下面這篇文章主要給大家介紹了關(guān)于前端之vue3使用WebSocket的詳細(xì)步驟,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-11-11
vue 導(dǎo)航錨點(diǎn)_點(diǎn)擊平滑滾動,導(dǎo)航欄對應(yīng)變化詳解
這篇文章主要介紹了vue 導(dǎo)航錨點(diǎn)_點(diǎn)擊平滑滾動,導(dǎo)航欄對應(yīng)變化詳解，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08
vue 實(shí)現(xiàn)復(fù)制內(nèi)容到粘貼板clipboard的方法
下面小編就為大家分享一篇vue 實(shí)現(xiàn)復(fù)制內(nèi)容到粘貼板clipboard的方法，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧2018-03-03