Vue Element検証validateの例


公式文書
制限入力指定タイプ
type制限を追加すればいいです。typeは以下の値を含みます。
例:

rules: {
  bannerType: [ { required: true, message: '     ', trigger: 'change'} ],
  associateId: [ { required: true, message: '     ', trigger: 'change'} ],
  associateData: [ { required: true, type: 'url', message: '       ', trigger: 'change' } ]
}
入力文字列の長さを指定します。
minとmaxで制限して、element validateは具体的にある値の後の制限規則は配列で、複数の制限を加えることができます。
例:

rules: {
  rewardReason: [
    { required: true, message: '       ', trigger: 'blur' },
    { max: 500, message: '    500  ' }
  ]
}
入力された値は、2つの値の間で、最大と最小の入力を指定します。
minとmaxで限定されていますが、直接使ってはいけないことが分かりました。入力を調べたら、el-inputのv-modelを追加します。number制限、つまりv-model.numberです。例:

<el-input v-model.number="form.rewardToLevel" style="display: inline;" placeholder="       " type="number"></el-input>
 
rules: {
  rewardReason: [
    { required: true, message: '       ', trigger: 'blur' },
    { max: 500, message: '    500  ' }
  ]
}
知識を補充します:vueコンポーネントの倉庫element-uiのvalidate方法
validate()の場合、elment-uiパッケージが良く、フォーム全体を検証するために使用されます。
validateのパラメータはコールバック関数です。このコールバック関数は、検証が完了した後に呼び出しられます。成功と検証されていないフィールドを確認しますか?
コールバック関数が入ってこないと、プロミセに戻ります。
パラメータ:Function(calback:Function(book,obj)

isPassはブール値で、trueの場合はチェックアウトを表します。

validate()チェックを呼び出すには、上記の図に示すように、prop属性バインディングチェック項目のフィールド名が必要です。
prop属性がnameというフィールド名にバインドされていない場合、フォームチェック時には変数ruleForm.nameの値は検証されません。
以上のVue Element検証validateの例は小編集が皆さんに提供した内容の全部です。参考にしていただければと思います。どうぞよろしくお願いします。