問題
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}(實際使用發現這個效果更好)