Question

我有一些来自AJAX调用的搜索结果以JSON的形式返回给我。我如何在ReactJS中创建复选框过滤器？在AngularJS中这很容易，但不确定它在ReactJS中是如何工作的。

例如，如果我自动想要复选框过滤器，请执行以下操作：

Supplier
[] Ewaste (2)
[] Mike's Cleaning (1)

Preferred
[] Green Business (1)
[] Minority Business (1)

Ratings
[] 1 (1)
[] 2 (1)
[] 3 (1)

我的JSON就像

{
  "searchresults": [
    {
      "id": 1,
      "name": "ABC Cleanup",
      "supplier": "EWaste",
      "type": "invoice",
      "status": "open",
      "status_message": "Open",
      "date": "2015/08/28",
      "totalAmount": null,
      "currency": "USD",
      "ratings": 1,
      ]
    },
    {
      "id": 2,
      "name": "Teaching BCD",
      "supplier": "EWaste",
      "type": "request",
      "preferred":"Green Business",
      "status": null,
      "status_message": null,
      "date": "2015/08/28",
      "totalAmount": null,
      "currency": "USD",
      "ratings": 2
    },
    {
      "id": 3,
      "name": "Mike's Pizza",
      "supplier": "Mike's Cleaning",
      "type": "invoice",
      "preferred":"Minority Business",
      "status": "open",
      "status_message": null,
      "date": "2015/08/31",
      "totalAmount": "10,201",
      "currency": "USD",
      "ratings": 3
    }
  ]
}

Answer 1

一切都取决于你。

我猜您正在使用json数据呈现table组件，并且您希望添加filters这些复选框作为table的过滤器。

如果您这样做，则应将json数据作为table组件的状态，调用setState或getInitialState来完成此工作。然后你应该使用表的state来渲染行。

然后你应该为所有复选框绑定一个事件处理程序，在处理程序中你应该确定过滤表的json数据应该是什么，然后用新的json数据调用setState来重新发送表。

如何使用JSON数据在ReactJS中呈现过滤器复选框？

1 个答案: