el-formコンポーネントの検証プロンプトをクリアする方法(フロントエンドスキルの向上)

エラー効果

間違った説明 

無線を切り替えると認証プロンプトが表示されますが、表示されないはずですが、これをキャンセルするにはどうすればよいですか?空白に設定しましたが、切り替え時に検証をキャンセルしなかったので、合格から拒否にクリアしたときに必ずプロンプトが表示されます。そのため、プロンプト検証メソッドを削除するだけで済みます。

 エラーコード

reviewStateChange(val) {
      if (val === '2') {
        this.ruleForm.remark = ''
      }
      if (val === '3') {
        this.ruleForm.remark = ''
      }
    }

正しいコード 

reviewStateChange(val) {
      if (val === '2') {
        this.ruleForm.remark = ''
      }
      if (val === '3') {
        this.ruleForm.remark = ''
        // this.$nextTick(() => {
        //   this.$refs.ruleForm.resetFields()
        // })
        this.$nextTick(() => {
          this.$refs.ruleForm.clearValidate() // 只清除清除验证
        })
      }
    }

 

まとめ方

①フォームコンテンツのクリアとフォーム検証メッセージのクリア

 

this.$nextTick(()=>{
        this.$refs.form.resetFields();
      })

 

②フォーム確認メッセージをクリアするだけでフォーム内容は理解できない 

this.$nextTick(()=>{
        this.$refs['form'].clearValidate() // 只清除清除验证
      })

 正しいスタイル

シーン拡張 

ページ切り替え時に同じFormコンポーネントを使用する場合、検証結果を削除する必要があり、機能には影響ありませんが、ページの表示が気持ち悪くなります。

 

おすすめ

転載: blog.csdn.net/2201_75705263/article/details/134062672