elementui plus 动态form表单添加表单项和动态的验证规则

复制代码
<el-form :model="state" validate-on-rule-change="false">
    <el-form-item
      :key="item.key"
      :label="item.field"
      :prop=//这里要使用:数据集合list.index.input组件绑定的值的名称的方式去添加prop,例如:"'params.' + idx + '.code'"
      :rules="
        !item.empty
          ? { required: false }
          : {
              required: true,
              message: `${item.field}不为空`,
              trigger: 'blur',
              validator: validateNull
            }
      "
    >
      <el-input v-model="item.code" :disabled="pageType === 'info'" :placeholder="item.field" />
    </el-form-item>
</el-form>
            
<script setup lang="ts">
            
state.params = props.info.params?.map((item: any) => {
      return {
        key: Date.now(),
        field: item.name,
        code: item.value,
        ...item
      }
    })
</script>
复制代码

 

posted @   洛晨随风  阅读(2589)  评论(4编辑  收藏  举报
相关博文:
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 单元测试从入门到精通
· 上周热点回顾(3.3-3.9)
· winform 绘制太阳,地球,月球 运作规律
历史上的今天:
2019-11-25 vue +ts 在router的路由中import报错的解决方案
点击右上角即可分享
微信分享提示