Element-plus + ts では、検証フォームはカスタム検証ルールを使用します

たとえば、携帯電話番号を確認します。

  ステップ 1: カスタム検証ルールを作成する

// 验证手机号
var checkMobile = (rule: any, value: any, callback: any) => {
    const regMobile = /^(0|86|17951)?(13[0-9]|15[012356789]|166|17[3678]|18[0-9]|14[57])[0-9]{8}$/
    if (regMobile.test(value)) {
        return callback()
    }
    return callback(new Error('请输入正确的手机号'))
}

 ステップ 2: 確認フォームの設定項目の下

let rules = reactive<FormRules>({
    phone: [
            { required: true, message: '请填写手机号', trigger: 'blur' }, 
            { validator: checkMobile, trigger: 'blur' }
          ]

仕上げる!

しかし、一部の大手企業では次のような状況に陥る人もいます。

 最初のパラメータ (ルール) がエラーを報告するのはなぜですか? ? ?

しかし、賢明な方であれば、依然として正しく検証でき、コードが正常に実行できることがわかるでしょう。

これは ts のせいだったことが判明しました。ts は、宣言されているが値が読み込まれていない、つまり、このパラメータは宣言されているが使用されていないことを示しました。

 どうやって解決すればいいでしょうか?? ?

      ts.config.json に移動し、これら 3 つの項目を false またはコメントに設定するだけです。

 "strict": false,
 "noUnusedLocals": false,
 "noUnusedParameters": false,

おすすめ

転載: blog.csdn.net/weixin_59739381/article/details/132118563
おすすめ