el-table中增加校验方法(二)

思路:element-ui组件中是自带from校验的,所以想校验表格可以在其外部封装一个from

javascript 复制代码
<template>
<el-form ref="formRef" :model="formData" :rules="formRules" :inline-message="true">
      <el-table
        :data="formData.mouldData"
        border
        stripe
        highlight-current-row
        :row-class-name="tableRowClassName"
        :cell-style="{ 'text-align': 'center' }"
        @row-click="handleRowClick"
        :header-cell-style="{
          background: '#b7babd',
          color: '#1e1f22',
          height: '35px',
          'text-align': 'center'
        }"
        style="width: 100%;max-height:45vh;overflow-y: auto"
        max-height="600"

      >
        <el-table-column label="序号" label-width="100px" type="index" />
        <el-table-column label="用户名称">
          <template #header> 用户名称</template>
          <template #default="scope">
            <el-form-item
              size="small"
              :prop="'mouldData.[' + scope.$index + '].evaluationProject'"
              :rules="formRules.evaluationProject"
              style="margin-top: 15px"
              v-show="scope.row.show"
            >
              <el-input v-model="scope.row.evaluationProject" size="large" @input="handleInput(scope.row)"/>
            </el-form-item>
            <span v-show="!scope.row.show">{{ scope.row.evaluationProject }}</span>
          </template>
        </el-table-column>
      </el-table>
      </el-form>
</template>
相关推荐
chushiyunen16 分钟前
python中的魔术方法(双下划线)
前端·javascript·python
终端鹿42 分钟前
Vue2 迁移 Vue3 避坑指南
前端·javascript·vue.js
进击的尘埃1 小时前
Signals 跨框架收敛:TC39 提案、Solid、Angular、Preact 的实现差异与调度策略对比
javascript
进击的尘埃1 小时前
从多仓到 Monorepo 的渐进式迁移:Git 历史保留、依赖收敛与缓存调优
javascript
SuperEugene2 小时前
TypeScript+Vue 实战:告别 any 滥用,统一接口 / Props / 表单类型,实现类型安全|编码语法规范篇
开发语言·前端·javascript·vue.js·安全·typescript
还是大剑师兰特2 小时前
Vue3 报错:computed value is readonly 解决方案
前端·vue.js
gis开发3 小时前
cesium 中添加鹰眼效果
前端·javascript
bluceli3 小时前
JavaScript动态导入与代码分割:优化应用加载性能的终极方案
javascript
kyriewen3 小时前
原型与原型链:JavaScript 的“家族关系”大揭秘
前端·javascript·ecmascript 6
滴滴答答哒3 小时前
layui表格头部按钮 加入下拉选项
前端·javascript·layui