我有一個巨大的輸入表單，需要填充資料并能夠保存進度，以便稍后完成表單，但僅當表單僅符合 1 個自定義規則時：
- 當表單不包含任何禁用詞時可以保存（假設禁用詞是[TEST1，TEST2]）
這意味著例如我有這樣的驗證規則：
validations: {
A: {
required,
$each: {
Aa: { required },
Ab: { required, dontHaveForbiddenWords },
Ac: { required, dontHaveForbiddenWords }
},
},
B: {
required,
Ba: { required, dontHaveForbiddenWords },
Bb: { required },
}
// ... a lot of additional fields
}
在這種情況下，我希望能夠在所有欄位為空時保存表單（因為它不包含禁用詞），即使它有未填寫的必填欄位。
問題是表單$invalid由于required規則而具有狀態，我不知道如何繞過它。
uj5u.com熱心網友回復：
更新：這個答案不起作用，這是我這邊的僥幸和糟糕的測驗，我設定為條件檢查的標志沒有重新應用，this.$v.$touch()并且一直保持默認值
正如@EstusFlask 建議的那樣，我創建了一個自定義驗證器，以便在某些情況下可以將其關閉，它使用頂級變數而不是引數，因為我想一次為所有欄位否決這個驗證器，也在我的專案中我有條件required validators，我發現沒有創建更好的解決方案，如果您編輯我的解決方案會很高興：
import { helpers } from 'vuelidate/lib/validators';
let isRequired = true;
const customRequiredValidator = (value) => {
return isRequired ? helpers.req(value) : true;
}
稍后在代碼中，我有 2 個處理程式：
- onSave() 我關閉
required規則的地方 - onSumbit() 我將
required規則重新設定為 ON
像這樣
onSave() {
isRequired = false;
if (this.$v.$invalid) {
isRequired = true;
// show alert
return;
}
isRequired = true;
// save form progress
}
// isRequired is always true after onSave
onSubmit() {
this.$v.$touch(); // to trigger the validation
if (this.$v.$invalid) return; // show alert
// sumbit the form
}
uj5u.com熱心網友回復：
可行的解決方案是使用JSON.stringify()
我的團隊將它與 stringify 配對validationState，并在包含我們的 validationRule 名稱的正則運算式字串上對其進行測驗，在我的例子中是dontHaveForbiddenWords，并檢查一個false值，這意味著整個表單上至少有 1 條規則失敗：
hasForbiddenCharacters() {
const validationStateString = JSON.stringify(this.$v.currentOffer, null, 0)
const hasForbiddenCharacters = /\"dontHaveForbiddenWords\":false/.test(validationStateString)
return hasForbiddenCharacters;
}
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/495997.html
標籤：javascript Vue.js 验证 Vuejs2 验证