时间戳

首页 > 解决方案 > how to get a specific data from antd table

reactjs - how to get a specific data from antd table

问题描述

im trying to get a specific data from an antd table, lets say im trying to get a name of a person from an antd table, here is how i create the onClick function to be called when i click everywhere in the specified row inside the table

<Table
          columns={this.props.columns}
          dataSource={this.state.dataSource}
          onRow={(r) => ({
            onClick: this.showDetailUser
          })}
          loading={this.state.loading}
          footer={this.props.footer}
        />

i want to print the name of a person from the clicked cell inside the row (not the clicked name), so i can click everywhere inside the cell and still got the name of the person, this method does work, i can click everywhere and the function get called successfully, but i cant find the method to get the data

any help will be appriciated, thanks before

标签： reactjsantd

解决方案

我猜你必须渲染你自己的表格行/列。Table 上的Antd 官方文档展示了一些示例。您必须在行/单元格上添加一个 onClick 侦听器。

（从文档中提取）

<Table dataSource={data}>
    <ColumnGroup title="Name">
      <Column title="First Name" dataIndex="firstName" key="firstName" />
      <Column title="Last Name" dataIndex="lastName" key="lastName" />
    </ColumnGroup>
    <Column title="Age" dataIndex="age" key="age" />
    <Column title="Address" dataIndex="address" key="address" />
    <Column
      title="Tags"
      dataIndex="tags"
      key="tags"
      render={tags => (
        <>
          {/*Here you should add your click handler*/}
          {tags.map(tag => (
            <Tag onClick={} color="blue" key={tag}>
              {tag}
            </Tag>
          ))}
        </>
      )}
    />
    <Column
      title="Action"
      key="action"
      render={(text, record) => (
        {/*Here you should add your click handler*/}
        <Space onClick={} size="middle">
          <a>Invite {record.lastName}</a>
          <a>Delete</a>
        </Space>
      )}
    />
  </Table>

（代码未测试）

推荐阅读