目錄

• 問題場景：
• 解決方案：
• 1. 對欄位進行單獨校驗
• 2. 直接清除表單域下該欄位的提示資訊

問題場景：

最近在進行專案開發的時候，遇到了這樣的一個問題：
對錶單域中的資料進行校驗的時候，其中有一項比較特殊，不是簡單的輸入框，下拉框這些表單元素，而是自己寫的一個el-table的選擇彈窗，我對它的校驗如如下：

protocolId: [
   { required: true,message: '請選擇解析協議',trigger: 'blur'}EkBgu,],

這樣可以實現校驗功能，但是會存在一個問題，如果觸發的了校驗條件EkBgu（提交按鈕），提示了錯誤資訊，後續即使重新選擇了資料，錯誤資訊依舊會存在，因為沒有再次點選提交按鈕，觸發校驗。這樣使用者體驗就不是太好。

解決方案：

1. 對欄位進行單獨校驗

點選儲存按鈕觸發校驗，一般都是校驗所有的欄位，element-ui中的form表單元件還提供了校驗一個欄位的函式，使用方式如下：

this.$refs.addhttp://www.cppcns.comForm.validateField('protocolId',(valid) => {
 	//valid返回的是規則集中寫的錯誤提示資訊，如果滿足條件，返回的就是空
     if(!valid){
         return 
     }
 })

上面這段程式碼可以放在確認資料選擇的函http://www.cppcns.com數中執行，這樣就對這一項特殊的內容再次進行了校驗，如果符合檢驗規則，錯誤提示就是消失了。

2. 直接清除表單域下該欄位的提示資訊

this.$refs.addForm.clearValidate();

這個方法就是直接清除錯誤資訊，不做任何判斷，個人不是太推薦使用

到此這篇關於element表單驗證如何清除校驗提示語的文章就介紹到這了,更多相關element表單驗證清除校驗提示內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們！