vue elementui表单验证组件动态修改required状态

最近遇到的需求：在一个表单里，有一个单选项检查结果：（无问题有问题不适用）（必填）和一个输入框问题描述：input(选填)，当但选项值为（有问题）时输入框为必填项，否则为选填项。如果像以前表单验证正常写法就会报错如下：正常显示代码如下下面展示一些内联代码片。<el-form-item label="问题描述" prop="desrc" :rules="{required:menuFor

一只快乐的小咩咩

7043人浏览 · 2021-11-17 15:02:17

一只快乐的小咩咩 · 2021-11-17 15:02:17 发布

最近遇到的需求：在一个表单里，有一个单选项检查结果：（无问题有问题不适用）（必填）和输入框问题描述下拉框整改状态：(选填)，当检查结果选项值为（有问题）时问题描述和整改状态变为必填项，否则为选填项。如果像以前表单验证正常写法就会报错如下：在这里插入图片描述
正常显示代码如下

下面展示一些 内联代码片。

<el-form-item label="问题描述" prop="desrc" :rules="{required:menuForm.result == '1'? true:false,message:'请输入问题描述'}">
    <el-input v-model="desrc" placeholder="请输入内容"></el-input>
</el-form-item>
// menuForm.result 为检查结果单选项的值 为1即代表选择有问题时

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^