ant design 表格columns配置解析(text, record)

前三个基本项不做过多的说明，title表示列头显示文字，dataIndex列数据在数据项中对应的 key，key是你数据中相对应传入的属性。

render函数返回三个值（text, record, index）,text表示本项内容对应的value，record的值是一个object，里面存放了这一行数据的内容，index表示当行索引。箭头后面的内容trans(text) 表示真正要在table表格显示的数据，相当于一个过滤器，可以把后台数据拿到的值直接在此处转换。width用来规定列宽，没有规定则自行根据内容显示列宽。官方文档有说明fixed: ‘right’，固定在列表右侧，但是当列不够多的时候，会显示两个一样的列。fixed:true的效果同fixed: ‘left’。

---

点击编辑时，通过record.id将ID传递给编辑页，获取该ID对应的数据信息，编辑页通过props: { location: { query: { id: any } } }，接收ID

// 列表页
{
      title: '操作',
      valueType: 'option',
      render: (text, record) => [
        <a key="editable" onClick={() => {
          history.push(`url?id=${record.id}`)
          console.log(record,'record.id')
          console.log(record.id,'record.id')
          }}>
          编辑
        </a>,
        <ProPopConfirm key="popConfirm" text="删除" onConfirm={() => confirm(record?.id)} />
      ]
    }

// 编辑页
export default (props: { location: { query: { id: any } } }) => {}