vue中按鈕操作完刷新頁面的實現(xiàn)
更新時間：2022年07月06日 11:54:52 作者：醉夢洛
這篇文章主要介紹了vue中按鈕操作完刷新頁面的實現(xiàn)方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
vue按鈕操作完刷新頁面
首先從子組件和父組件角度去寫這個東西，簡言之就是在父組件中實現(xiàn)這個刷新功能方法，然后在子組件中進行綁定并進行監(jiān)聽就好了啊
1.父組件中實現(xiàn)
① 圖示部分：
個人建議這個作為父組件，肯定一般是放在列表中的，即把列表頁面作為父組件的歸屬地
② 代碼部分：
method方法中部分
refresh () {
this.reload()
}將reload進行注入
inject: ['reload'],
2.子組件綁定
① 子組件進行綁定
在父組件中引用子組件頁面的地方進行綁定
如圖：
綁定腳本：
@refresh="refresh"
② 單獨去子組件頁面處理成功的地方去監(jiān)聽
圖示：比如就以這個頁面為例子
進入子頁面：
在子頁面組件中處理成功后進行監(jiān)聽父組件中刷新方法，以上設(shè)置完就ok了
點擊按鈕后自動刷新頁面
在按鈕點擊事件中添加
window.location.reload();
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了vue實現(xiàn)瀏覽器全屏展示功能,項目中使用的是sreenfull插件，執(zhí)行命令安裝，具體實現(xiàn)代碼跟隨小編一起看看吧2019-11-11
這篇文章主要介紹了vue3 vite配置跨域以及不生效問題,本文給大家分享完美解決方案，需要的朋友可以參考下2023-07-07
本文主要介紹了vue中動態(tài)修改img標簽中src的方法實踐,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2023-07-07
這篇文章主要介紹了Vue使用video.js的代碼詳解,包括在vue腳手架中引入video.js，實例化了視頻.js播放器，并在上銷毀了它，結(jié)合示例代碼給大家介紹的非常詳細，需要的朋友可以參考下2022-03-03
這篇文章給大家分享了基于vue實現(xiàn)一個簡單的MVVM框架的相關(guān)內(nèi)容，有需要的朋友們可以參考學習下。2018-08-08
這篇文章主要介紹了淺談vue父子組件怎么傳值,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-07-07
vue中的this.$router.push()路由傳值方式
這篇文章主要介紹了vue中的this.$router.push()路由傳值方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10
這篇文章主要介紹了vite如何build時清除console.log()問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-07-07
vue-router 是一個插件，需要在 Vue 的全局引用中通過 Vue.use()將它引用到 Vue 實例當中。接下來通過本文給大家分享vue-router路由與頁面間導航，需要的朋友參考下吧2017-11-11
在Vue3中創(chuàng)建和使用全局組件的實現(xiàn)方式
在前端開發(fā)中,Vue.js 是一個廣泛使用的框架,因其靈活性和強大的功能,得到許多開發(fā)者的喜愛,Vue 3 的發(fā)布為這一框架帶來了很多新的特性和改進,在本文中,我們將詳細討論如何在 Vue 3 中創(chuàng)建和使用全局組件,并通過示例代碼展示具體實現(xiàn)方式,需要的朋友可以參考下2024-07-07