react-table添加编辑/删除列

Tri*_*y76 17 react-table

我使用Rails和React-Table来显示表.它到目前为止工作正常.但是如何在React-Table中添加编辑/删除列?

它甚至可能吗?

return (
    <ReactTable
      data={this.props.working_hours}
      columns={columns}
      defaultPageSize={50}
      className="-striped -highlight"
    />
    )
Run Code Online (Sandbox Code Playgroud)

Ric*_*hen 30

您需要做的就是变成columns组件状态.您可以看到一个工作示例https://codesandbox.io/s/0pp97jnrvv

[更新时间:3/5/2018]误解了这个问题,这是更新后的答案:

const columns = [
    ...
    {
       Header: '',
       Cell: row => (
           <div>
               <button onClick={() => handleEdit(row.original)}>Edit</button>
               <button onClick={() => handleDelete(row.original)}>Delete</button>
           </div>
       )
    }
]
Run Code Online (Sandbox Code Playgroud)

其中,handleEdithandleDelete将要如何被点击的按钮后处理措施的回调.

  • 据我了解您的演示,您有一个显示/隐藏列功能。但我要求“编辑/删除行”列。 (2认同)