解決vue+ element ui 表單驗證有值但驗證失敗問題
更新時間：2020年01月16日 08:34:46 作者：ExcuMe
這篇文章主要介紹了vue+ element ui 表單驗證有值但驗證失敗，本文通過實例代碼給大家分享解決方案，非常不錯，具有一定的參考借鑒價值,需要的朋友可以參考下
一.如圖：有值但是驗證失敗
二.
<el-form :model="form" :rules="rules">
<el-form-item label="數(shù)據模板" prop="template" >
<el-col :span="20">
<el-input type="textarea" v-model="form.template" :rows="8" placeholder="請輸入數(shù)據模板" :readonly="true" ></el-input>
</el-col>
</el-form-item>
</el-form>
export default {
data() {
return {
form: {
template: null
}
rules: [
template:{required: true, message: '數(shù)據模板不能為空', trigger: 'blur'}
]
}
}
}
以上是正確的驗證例子。
三.
目前碰到兩種情況會導致驗證失敗，而且使用自定義驗證形式的時候發(fā)現(xiàn)value的值為undefined：
1.prop和v-model的值名稱不一致
1必須和2名稱保持一致，3處的變量也需和2處的prop保持一致
2.在data{}里面沒有聲明變量也會導致驗證失敗，使獲取的值value值為undefined。
總結
以上所述是小編給大家介紹的解決vue+ element ui 表單驗證有值但驗證失敗問題，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持！
如果你覺得本文對你有幫助，歡迎轉載，煩請注明出處，謝謝！
相關文章
前端vue+elementUI如何實現(xiàn)記住密碼功能
這篇文章主要給大家介紹了關于vue+elementUI如何實現(xiàn)記住密碼功能的相關資料，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-09-09
完美解決vue 項目開發(fā)越久 node_modules包越大的問題
這篇文章主要介紹了vue 項目開發(fā)越久 node_modules包越大的問題及解決方法,本文給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-09-09
Vue服務端渲染和Vue瀏覽器端渲染的性能對比(實例PK )
這篇文章主要介紹了Vue服務端渲染和Vue瀏覽器端渲染的性能對比(實例PK ),非常不錯，具有參考借鑒價值，需要的朋友可以參考下2017-03-03
Vue2.x 項目性能優(yōu)化之代碼優(yōu)化的實現(xiàn)
這篇文章主要介紹了Vue2.x 項目性能優(yōu)化之代碼優(yōu)化的實現(xiàn),文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2021-03-03
這篇文章主要介紹了如何使用 vue-cli 創(chuàng)建模板項目，幫助大家更好的理解和學習vue框架的知識，感興趣的朋友可以了解下2020-11-11
這篇文章主要介紹了vite+vue3中如何使用router問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-06-06
關于vue-lunar-full-calendar的使用說明
這篇文章主要介紹了關于vue-lunar-full-calendar的使用說明，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-07-07
Vue報錯:TypeError:?Cannot?create?property?‘xxxx‘?on的解決
這篇文章主要介紹了Vue報錯:TypeError:?Cannot?create?property?‘xxxx‘?on的解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-06-06
這篇文章主要為大家詳細介紹了Vue filters過濾器的使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-07-07
今天小編就為大家分享一篇vue-router 中 meta的用法詳解，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-11-11