时间戳

首页 > 解决方案 > 如何在 ReactJS 中的数据表内的按钮上设置 onClick 事件

reactjs - 如何在 ReactJS 中的数据表内的按钮上设置 onClick 事件

问题描述

我在 jQuery 中看到了几个工作示例，但在 React 的上下文中没有。所以想要提出这个特定的查询。

我有一个反应组件类，它呈现一个数据表（如在 datatables.net 中）。我使用 column:defaultContent of datatable-Options 为数据表中的每一行添加了一个查看按钮。

我编写了一个类 Method，它应该在按下视图按钮时执行。

columnDefault 选项中嵌入的 HTML 是

                columns: [
                  { "defaultContent":`<button onClick=${this.onView}>View</button>`},
                  { data: "name" },
                  { data: "email" },
                  { data: "mobile", "defaultContent": "<i>Not set</i>" },
                  { data: "landline", "defaultContent": "<i>Not set</i>"}
                ]

我可以看到按钮已呈现。

挑战在于让 onView 方法使用特定的 recordId 执行。

标签： reactjs

解决方案

如果您想将数据传递给绑定到 onclick 按钮的回调函数，您可以使用下面提到的代码

<button onClick=${() => this.onView(recordId)}>View</button>

推荐阅读