Javascript DataTables—在'；columnDefs'；反应

因此，当我在react中创建DataTable时，使用属性定义某个列

"columnDefs": [
            {
              "targets": 7,
              "data": "data",
              "render": function ( data, type, full, meta ) {
                return "<button onclick='test()'>view</button>"
              }
            }
          ]

“columnDefs”：[
{
“目标”：7，
“数据”：“数据”，
“呈现”：函数（数据、类型、完整、元）{
返回“视图”
}
}
]

但正如所料，它找不到

test（）

函数。有没有其他方法可以使用这种jsx风格？还是只需在onclick中创建函数？

您可以这样尝试：

$('#your_table').DataTable({

. . . 

"columnDefs": [{
                "targets": 7,
                "data": "data",
                "render": function ( data, type, full, meta ) {
                            return "<button class='view_btn' data-id='"+data+"'>view</button>"
                          }
              }]

---

在这种情况下不能使用render，因为函数将被直接调用。您可以在

columnDefs

中使用箭头函数和instead。 例如，组件中有一个函数：

 this.test= this.test.bind(this);

通过以下方式调用

columnDefs

中的函数：

"columnDefs": [{
  "targets": 0,
  "data": "data",
  "createdCell": (td, cellData, rowData, row, col) => {
    $(td).click(e => {
      this.test();
    })
  }
}]

---

查看上面的链接以获取更多信息。

我或多或少在寻找一种方法来使用react方法，例如

onclick={this.test}

。如果不可能，那么一个带有解释的“不可能”答案就可以了。这是一种绕过它的方法。你可能是对的，尽管我不再有访问代码的权限，所以我不能真正将其标记为答案：(

"columnDefs": [{
  "targets": 0,
  "data": "data",
  "createdCell": (td, cellData, rowData, row, col) => {
    $(td).click(e => {
      this.test();
    })
  }
}]