溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章運用簡單易懂的例子給大家介紹element-ui和vue實現表單驗證提示語清除操作，內容非常詳細，感興趣的小伙伴們可以參考借鑒，希望對大家能有所幫助。
代碼一、
let result = Vue.extend({
name: 'recommend-list',
template: template,
watch: {
dialogSequenceVisible: function (val,oldVla) {
this.$refs["form"].resetFields();
}
},
data() {
let validateSequence = (rule, value, callback) => {
let val = this.trim(value);
if (val == '') {
callback(new Error('順序值不允許為空'));
} else if (value > 9223372036854775807) {
callback(new Error('順序值不能超過9223372036854775807'));
} else if (!this.isNumber(val)) {
callback(new Error('必須輸入正整數'));代碼二、
<el-dialog title="調整順序" :visible.sync="dialogSequenceVisible" @close='closeDialog'>
<el-form label-width="200px" :model="form" :rules="rules" ref="form">
<el-form-item label="請輸入調整的順序值："
prop="sequence">
<el-input v-model="form.sequence" auto-complete="off"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="dialogSequenceVisible = false">取 消</el-button>
<el-button type="primary" @click="position()">確 定</el-button>
</div>
</el-dialog>圖二、
但是,這樣會頁面調試模式會報錯 “ Cannot read property 'resetFields' of undefined ” 錯誤, 應該是第一次彈出dialog對話框的時候沒有弄到DOM里, 需要修改vue中的watch代碼, 做個限定. 這樣不但可以清除提示語, 還可以清空輸入框里內容殘留， 如下:
let result = Vue.extend({
name: 'recommend-list',
template: template,
watch: {
dialogSequenceVisible: function (val,oldVla) {
if (this.$refs['form'] != undefined) {
this.$refs["form"].resetFields();
}
}
},補充知識：elementUI vue 編輯中的input的驗證殘留清除
當使用編輯的時候, 假如上次的驗證沒通過, 報紅了, 下次再點擊編輯的時候還會報紅,因此要清除驗證殘留, 方式有兩種:
this.$refs["from"].resetFields(); //移除校驗結果并重置字段值
this.$refs["from"].clearValidate(); //移除校驗結果
關于element-ui和vue實現表單驗證提示語清除操作就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
