React Typescript Antd 表（expandedRowRender）過濾器

Question

我正在嘗試將我的語言行過濾到每個無列，但它只是將所有語言數據打印到所有行中：

該框標記了應該在行中的唯一數據項：

這是列的代碼：

const expandedRowRender = () => {
  columns = [
    {
      title: "Sprache",
      key: "no",
      render: () => {
        return (
          <Space direction="vertical">
            <Text>{MediaRecorder.de}</Text>
            <Text>{MediaRecorder.end}</Text>
          </Space>
        );
      },
    },
  ];
  return (
    <Table
      columns={columns}
      dataSource={this.StaticRange.question}
      rowKey={(record) => record.no}
    />
  );
};

Answer 1

expandRowRenderer 具有 arguments，您可以使用它來根據父表數據過濾您的內部表。

const expandedRowRender = (record, index, indent, expanded) => {
  //you can use record here to filter datasource
  columns = [
    {
      title: "Sprache",
      key: "no",
      render: () => {
        return (
          <Space direction="vertical">
            <Text>{MediaRecorder.de}</Text>
            <Text>{MediaRecorder.end}</Text>
          </Space>
        );
      },
    },
  ];
  return (
    <Table
      columns={columns}
      dataSource={this.StaticRange.question}
      rowKey={(record) => record.no}
    />
  );
};