响应表组件的onClick事件

Question

我正在使用'react-table'组件https://react-table.js.org

我想为一列添加点击事件（稍后我将打开一个显示基于此事件的信息的模式）。

Answer 1

将getTrProps添加到ReactTable，例如：

const onRowClick = (state, rowInfo, column, instance) => {
    return {
        onClick: e => {
            console.log('A Td Element was clicked!')
            console.log('it produced this event:', e)
            console.log('It was in this column:', column)
            console.log('It was in this row:', rowInfo)
            console.log('It was in this table instance:', instance)
        }
    }
}


<ReactTable data={[]} columns={[]} getTrProps={onRowClick} />

Answer 2

撰写本文时，React-Table 6.8.0：

＆＃39;列＆＃39;的值在＆＃39; getTrProps＆＃39;属性总是未定义的。

您必须使用＆＃39; getTdProps＆＃39;财产而不是。