私はvee-validateを使用しており、2つのフィールドがあります。1つは自宅の電話用、もう1つは携帯電話用です。ルールに両方を「必須」にする必要はありませんが、必要なのはこれらの少なくとも1つが必須です。
それで、私の質問ですが、少なくとも1つのフィールドの入力について両方のフィールドをチェックするルールを設定することは可能ですか？
さて、それほど時間はかかりませんでしたが、私はこれを機能させています。少し掘り下げただけなので、他の人を助けることができるように私の答えを投稿してください。
まず、私の入力フィールドがありHOMEPHONEや携帯電話、それらの少なくとも一方が必要です。
次のVueで計算されたプロパティを使用して達成できます。
computed: {
isHomePhoneRequired() {
if(this.cellphone === '')
return true; // homephone is required
return false;
},
isCellPhoneRequired() {
// check if homephone is empty
if(this.homephone === '')
return true; // cellphone is required
return false;
}
}
私のHTMLは次のようになります。
<div class="form-group" :class="{'has-error': errors.has('homephone') }">
<div class="label">Home Phone<i class="fa fa-asterisk required" aria-hidden="true"></i></div>
<div ><input type="text" class="form-control" v-model="homephone" v-validate ="{ rules: { required: this.isHomePhoneRequired} }" data-vv-name="homephone" data-vv-as="Home Phone" /></div>
<p class="text-danger" v-if="errors.has('homephone')">{{ errors.first('homephone') }}</p>
</div>
<div class="form-group" :class="{'has-error': errors.has('cellphone') }">
<div class="label">Cell Phone<i class="fa fa-asterisk required" aria-hidden="true"></i></div>
<div ><input type="text" class="form-control" v-model="cellphone" v-validate ="{ rules: { required: this.isCellPhoneRequired} }" data-vv-name="cellphone" data-vv-as="Cell Phone" /></div>
<p class="text-danger" v-if="errors.has('cellphone')">{{ errors.first('cellphone') }}</p>
</div>
v-validateが、タイプ（ルール）、使用する検証（必須）、および計算されたプロパティ（isHomePhoneRequired）を含む渡されたオブジェクトを取得することに注意してください。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加