問題描述 : 在elementUI中 , Form表單設(shè)置了rules校驗規(guī)則 , 正常情況下 , 進頁面是不會觸發(fā)校驗規(guī)則的 , 但是select下拉框設(shè)置了multiple 多選屬性之后 , 就會產(chǎn)生bug . 原因是select下拉框設(shè)置多選屬性之后 , 進頁面就會觸發(fā)change事件導致觸發(fā)校驗規(guī)則 , 如圖
bug現(xiàn)象
解決方案 :
1 . 在 created 鉤子函數(shù)中 , 默認將綁定的值設(shè)置為空數(shù)組 this.$set(this.rowData, 'reason', [])? /* this.rowData為props接收的對象, reason是select下拉框v-model綁定的值 */?
解決方案1
2 . 其他同事的做法 , 設(shè)置一個data值 , 校驗的時候去控制
解決方案2
3 . 之前在網(wǎng)上看的方法 , 其實感覺不是很正確哈 , 應(yīng)該是我水平低了 , 我寫的時候 , 會發(fā)生其他的bug. 使用?this.$refs.editForm.resetFields() 在created中清空form表單的校驗 , 注意要寫在 nextTict中 , 方法比較暴力 , 確實可以將檢驗關(guān)閉 , 但是我這邊產(chǎn)生了bug , 就是其他的input輸入框 , 不能渲染輸入的內(nèi)容 , 每次輸入的內(nèi)容都會被清掉 ... 有興趣的可以研究一下 , 然后給我留言哦 ~
未解決bug的方案