相关疑难解决方法(0)

我正在尝试找到与我的反应应用程序一起使用的最佳表格,而现在,react-table提供了我需要的一切(分页,服务器端控制,过滤,排序,页脚行).

话虽如此,我似乎无法选择一行.没有举例说明这一点.

我尝试过的一些事情包括尝试在点击行时设置className.但我似乎无法找到调用元素e也不t.此外,我不喜欢这种方法,因为反应应用程序不应该如何做事.

<ReactTable
            ...
            getTrProps={(state, rowInfo, column, instance) => {
                return {
                    onClick: (e, t) => {
                        t.srcElement.classList.add('active')
                    },
                    style: {
                    }
                }
            }}
        />

一些可能的解决方法是将复选框渲染为第一列,但这不是最佳选择,因为它限制了单击以"激活"该行的区域.此外,视觉反馈将不那么富有表现力.

我在房间里想念大象吗？如果没有,你知道另一个支持我之前描述过的东西的图书馆吗？

谢谢!

编辑: 另一种选择,这是开源,是建议编辑.也许这是正确的事情.

编辑2

另一件事,由DavorinRuševljan在评论中提出,但我无法使其发挥作用:

onRowClick(e, t, rowInfo) {
    this.setState((oldState) => {
        let data = oldState.data.slice();
        let copy = Object.assign({},  data[rowInfo.index]);

        copy.selected = true;
        copy.FirstName = "selected";
        data[rowInfo.index] = copy;

        return {
            data: data,
        }
    })
}

....

            getTrProps={(state, rowInfo, column) => {
                return …

我正在尝试实现一次只能选择一行的反应表。我已经在反应表中经历了很多多行选择的示例，但就我而言，当用户单击单选按钮时，用户只能选择一行，但目前可以选择所有行。有人可以帮我解决这个问题吗？

嗨，我正在尝试设置我的反应应用程序，以便当您单击反应表中行项目中的按钮时，该行中的数据将传递到另一个组件。目前我只是想在 console.log 中记录正确的数据，但不确定如何根据点击传递反应表行数据。我怎样才能做到这一点？谢谢

我的虚拟数据与按钮（显示详细视图）一起存储在状态中，我想触发通过 onclick 的数据：

    columns: [
      {
        Header: "First Name",
        accessor: "fname"
      },
      {
        Header: "Last Name",
        accessor: "lname"
      },
      {
        Header: "Employee Group",
        accessor: "egroup"
      },
      {
        Header: "Date of Birth",
        accessor: "dob"
      },
      {
        Header: "",
        id: "id",
        Cell: ({ row }) => (
          <button onClick={e => this.handleShow()}>
            Detailed View
          </button>
        )
      },
    ],
    posts: [
      {
        fname: "gerald",
        lname: "nakhle",
        egroup: "faisbuk",
        dob: "8/10/1995"
      }
    ]

我调用渲染表：

<ReactTable columns={this.state.columns} data={this.state.posts}></ReactTable>

我的 onclick 处理函数，但我不确定如何访问我所追求的表格行数据

handleShow(e) { …