vue3 实现el-table表格 逐行校验

  • vue3+elementPlus 实现对表格每行的编辑删除操作,编辑点击完成有表单校验。

表格可以设置行操作,你再写一个编辑的弹窗,表单校验加进去,应该没什么复杂的。

//表格行操作
    <el-table-column fixed="right" label="Operations" width="120">
      <template #default>
        <el-button link type="primary" size="small" @click="handleClick"
          >Detail</el-button
        >
        <el-button link type="primary" size="small">Edit</el-button>
      </template>
    </el-table-column>

编辑弹窗:https://element-plus.gitee.io/zh-CN/component/message-box.html#%E6%8F%90%E4%BA%A4%E5%86%85%E5%AE%B9
表单校验:https://element-plus.gitee.io/zh-CN/component/form.html#%E8%A1%A8%E5%8D%95%E6%A0%A1%E9%AA%8C