Vue Form 主动显示错误信息,主动valid错误信息,手动显示valid错误信息

Vue Form 主动显示错误信息,主动valid错误信息,手动显示valid错误信息

model信息:

formModel: {
	name: ''
}

验证规则:

formRules: {
	name: [
          { required: true, message: '请选输入名字', trigger: ['blur', 'change'] }
    ]
}

表单:

<el-form
      ref="form"
      align="center"
      :model="formModel"
      :rules="formRules">
      <el-form-item prop="name">
      		<el-input v-model="formModel.name" />
      </el-form-item>
</el-form>      

手动显示错误信息方法:

  • 1、el-form-item 标签需要指定 prop
  • 2、rules 需要指定属性,可以没有规则

this.$refs[‘form’].fields[0].validateMessage = ‘错误信息’

this.$refs[‘form’].fields[0].validateState = ‘error’

猜你喜欢

转载自blog.csdn.net/H1101370034/article/details/122883261