淺談vue同一頁面中擁有兩個表單時,的驗證問題
更新時間：2018年09月18日 11:20:02 作者：快樂的大羊
今天小編就為大家分享一篇淺談vue同一頁面中擁有兩個表單時,的驗證問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
問題：如果vue的同一個頁面擁有兩個表單。驗證第一個表單時沒有通過就切換到第二個，那么第二個表單會出現(xiàn)驗證錯誤的信息
我們可以通過為兩個表單添加ref屬性
之后在通過調(diào)用resetFields()方法來解決問題
代碼如下
<el-form :model="form" :rules="rules" ref="form" label-width="100px">
this.$refs["form"].resetFields();
以上這篇淺談vue同一頁面中擁有兩個表單時,的驗證問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
小編使用的是webpack模板在vue-cli生成的工程中引入jquery的方法，首先在package.json里的dependencies加入"jquery" : "^2.2.3"，然后install，具體內(nèi)容詳情大家參考下本文2018-01-01
這篇文章主要介紹了vue中的mescroll搜索運用及各種填坑處理，文中通過代碼給大家講解了mescroll vue使用，感興趣的朋友跟隨小編一起看看吧2019-10-10
這篇文章主要介紹了vue-router 前端路由之路由傳值的方式，本文通過兩種方式給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值,需要的朋友可以參考下2019-04-04
Vue報錯:TypeError:?Cannot?create?property?‘xxxx‘?on的解決
這篇文章主要介紹了Vue報錯:TypeError:?Cannot?create?property?‘xxxx‘?on的解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-06-06
elementui中的el-cascader級聯(lián)選擇器的實踐
本文主要介紹了elementui中的el-cascader級聯(lián)選擇器的實踐，文中通過示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10
在本篇內(nèi)容里小編給大家整理了關(guān)于vue寫h5頁面的方法以及注意點分析，有需要的朋友們跟著學(xué)習(xí)下吧。2019-02-02
今天小編就為大家分享一篇Vue的click事件防抖和節(jié)流處理詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11
javascript中Set、Map、WeakSet、WeakMap區(qū)別
這篇文章主要介紹了javascript中Set、Map、WeakSet、WeakMap區(qū)別,需要的朋友可以參考下2022-12-12
這篇文章主要介紹了vue移動端自適應(yīng)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05
vue中props賦值給data出現(xiàn)的問題及解決
這篇文章主要介紹了vue中props賦值給data出現(xiàn)的問題及解決，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-10-10