Question

我在搜索react-bootstrap-table中的对象数组时遇到问题，问题是filterValue只在最后一列工作。

我拥有的数据：

"customers": [
 {
  "name": "customer name",
  "email": "cname@email.com",
  "address": [
   {
    "country": "cCountry1",
    "city": "cCity1"
   }
  ]
 }
]

我在两个字段中都输入dataField='address'，然后使用dataFormat格式化每个字段。

showCountry(cell) {
   if (cell.length > 0) {
       return cell[0].country
   }
   return null
}

filterCountry(cell) {
   if ( cell.length > 0 ) {
       return cell[0].country
   }
   return null
}

render() {
return (

<BootstrapTable data={data.businessAccount.customers} selectRow={ selectRowProp } options= { options } hover  pagination search >
   <TableHeaderColumn isKey dataField='id' hidden>ID</TableHeaderColumn>
   <TableHeaderColumn width={this.state.cellSize} dataField='name'>Name</TableHeaderColumn>
   <TableHeaderColumn width={this.state.cellSize} dataField='email'>Email</TableHeaderColumn>
   <TableHeaderColumn width={this.state.cellSize} dataField='phone' dataAlign="center">Phone</TableHeaderColumn>
   <TableHeaderColumn width={this.state.cellSize} dataField='address' dataFormat={this.showCountry} filterValue={this.filterCountry} dataAlign="center">Country</TableHeaderColumn>                                               
   <TableHeaderColumn width={this.state.cellSize} dataField='address' dataFormat={this.showCity} filterValue={this.filterCity} dataAlign="center">City</TableHeaderColumn>
   <TableHeaderColumn width={this.state.cellSize} dataField='status' dataFormat={this.formatStatus} dataAlign="center">Status</TableHeaderColumn>
</BootstrapTable>
)}

我猜是问题所在，filterValue似乎看到了第二个字段，因为它与国家/地区共享相同的dataField，因为即使我从中删除了address.city，它仍在过滤filterValue ！我也尝试过filterFormatted，但是有同样的问题。

在不使用dataFormat的情况下通过传递精确字段来解决此问题的任何帮助吗？或另一种过滤方式。

使用filterValue在react-bootstrap-table中搜索复杂数据

0 个答案: