如何将一个表单列表的每一行数据,加一个修改和删除按钮呢?

如何将一个表单列表的每一行数据,加一个修改和删除按钮呢?

问题描述:

将后端返回的数据列表,不确定多少,或许有很多页,每一个数据的一行左边或左边加上一个修改的按钮。不能是在form表单对应的一行写死吧。。也不允许呀,那么多的数据。。
类似 这样的。

img

通过js遍历数据,js创建标签元素动态添加

服务端返回的数据可以转成数组吧,表单里的每一行数据不就对应数组中的一条数据,数组的长度不就代表了遍历多少次么

你这是什么UI组件库

elment- ui很好操作这个啊

如果没看错,这是element-admin吧,使用的应该是elementui的组件。
下方组件里的固定列
https://element.eleme.cn/#/zh-CN/component/table
里有一个操作列,你可以参考下

<el-table-column
      fixed="right"
      label="操作"
      width="100">
**      <template slot-scope="scope">
        <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
          <el-button type="text" size="small">编辑</el-button>**
      </template>**
    </el-table-column>

在template slot-scope="scope"里写