element表單有值但驗證仍顯示為空_和el-tree連用賦值


問題

element 表單增加了rules規則,其中一個input輸入框不能為空,input的值和el-tree關連

操作如下:

1.點擊表單input

2出現彈出框,彈出框內有el-tree,點擊el-tree的值A,

3.彈框自動關閉,A自動賦值到input中,

4.此時element的驗證會顯示input中並沒有值,然而我們可以看到input中是有值A的。

5.二次點擊input,選取el-tree的值,表單驗證通過

原因

出現這個問題,是因為rules規則input上{trigger:blur}(失去焦點時驗證表單內容)。點擊input,出現彈出框,此時input失去焦點,並且input確實沒有值,所以失去焦點會觸發rules驗證;當el-tree上的值賦值給input時,沒有“失去焦點”操作,所以rules不會進行驗證,而是維持上一次的驗證結果,即提示用戶沒有輸入值。

解決

解決方法一:點擊input,給input賦值如”請輸入xxx“,然后出現彈出框(彈框會遮擋住input內容,所以不影響頁面展示)

解決方法二:rules中input的規則改為{trigger:change}(實際使用發現這個效果更好)


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM