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>
相关推荐
鱼与宇6 分钟前
苍穹外卖-VUE
前端·javascript·vue.js
用户479492835691524 分钟前
Safari 中文输入法的诡异 Bug:为什么输入 @ 会变成 @@? ## 开头 做 @ 提及功能的时候,测试同学用 Safari 测出了个奇怪的问题
前端·javascript·浏览器
裴嘉靖42 分钟前
Vue 生成 PDF 完整教程
前端·vue.js·pdf
毕设小屋vx ylw2824261 小时前
Java开发、Java Web应用、前端技术及Vue项目
java·前端·vue.js
冴羽2 小时前
今日苹果 App Store 前端源码泄露,赶紧 fork 一份看看
前端·javascript·typescript
蒜香拿铁2 小时前
Angular【router路由】
前端·javascript·angular.js
时间的情敌2 小时前
Vite 大型项目优化方案
vue.js
西洼工作室2 小时前
高效管理搜索历史:Vue持久化实践
前端·javascript·vue.js
樱花开了几轉2 小时前
element ui下拉框踩坑
开发语言·javascript·ui
故事不长丨3 小时前
【Java SpringBoot+Vue 实现视频文件上传与存储】
java·javascript·spring boot·vscode·后端·vue·intellij-idea