Element?ui關(guān)閉el-dialog時(shí)如何清除數(shù)據(jù)
更新時(shí)間：2024年02月29日 10:28:40 作者：Temptat14x
這篇文章主要介紹了Element?ui關(guān)閉el-dialog時(shí)如何清除數(shù)據(jù)問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教
element ui關(guān)閉el-dialog時(shí)清除數(shù)據(jù)
如果是按叉叉關(guān)閉或者點(diǎn)表單以外空白處關(guān)閉的話
可以給el-dialog添加
:before-close="closeForm"
在methods里添加函數(shù)
closeForm(){
this.$refs.form.resetFields();//清除數(shù)據(jù)
this.dialogFormVisible=false;//關(guān)閉對(duì)話框
}如果是按取消按鈕清除數(shù)據(jù)，也可以給取消按鈕綁定點(diǎn)擊事件，點(diǎn)擊取消則調(diào)用closeForm函數(shù)。
注意：
1.要為每個(gè) form-item 加上 prop 屬性，要不然無(wú)法清空
2.resetFields() 方法是重置表單，重置為初始值，而不是設(shè)置為空值
element ui對(duì)話框el-dialog關(guān)閉事件,清空填寫的數(shù)據(jù)
通常會(huì)有需求，在關(guān)閉彈框后需要清空填寫的數(shù)據(jù)，這時(shí)候就需要關(guān)閉事件了
<el-dialog title="標(biāo)題" :visible.sync="bind" size="small" @close='closeDialog'> </el-dialog>
在標(biāo)簽中加入@close='closeDialog'
mothods中加入
//關(guān)閉彈框的事件
closeDialog(){
this.xxx = '';//清空數(shù)據(jù)
},總結(jié)
以上為個(gè)人經(jīng)驗(yàn)，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了淺談vue 多個(gè)變量同時(shí)賦相同值互相影響，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-08-08
vue的過(guò)濾器通常用在一些常見的文本格式化，過(guò)濾器可以用在兩個(gè)地方：雙花括號(hào)插值和 v-bind 表達(dá)式。本文給大家介紹了web前端vue filter 過(guò)濾器的相關(guān)知識(shí)，感興趣的朋友一起看看吧2018-01-01
vue如何實(shí)現(xiàn)路由跳轉(zhuǎn)到外部鏈接界面
這篇文章主要介紹了vue如何實(shí)現(xiàn)路由跳轉(zhuǎn)到外部鏈接界面，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。2022-10-10
vue中的watch監(jiān)聽數(shù)據(jù)變化及watch中各屬性的詳解
這篇文章主要介紹了vue中的watch監(jiān)聽數(shù)據(jù)變化及watch中的immediate、handler和deep屬性詳解，本文大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友參考下吧2018-09-09
這篇文章主要為大家詳細(xì)介紹了Vue中使用vux配置的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-05-05
Vue實(shí)例中el和data的兩種寫法小結(jié)
這篇文章主要介紹了Vue實(shí)例中el和data的兩種寫法,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-11-11
watchEffect，它立即執(zhí)行傳入的一個(gè)函數(shù)，同時(shí)響應(yīng)式追蹤其依賴，并在其依賴變更時(shí)重新運(yùn)行該函數(shù)，本文主要介紹了Vue3中watchEffect的具體用法，感興趣的可以了解一下2022-05-05
vue實(shí)現(xiàn)上傳圖片添加水印(升級(jí)版)
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)上傳圖片添加水印的升級(jí)版，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-09-09
關(guān)于ElementUI自定義Table支持render
這篇文章主要介紹了關(guān)于ElementUI自定義Table支持render，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-10-10
本篇文章主要介紹了vue 里面使用axios 和封裝的示例代碼，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-09-09