reactjs - Mostrar valores booleanos y de marca de tiempo dentro de react-table: React Table + React + Typescript
Estoy tratando de imprimir los valores booleanos y de marca de tiempo que son devueltos por alguna API. No puedo hacer lo mismo. Se agradecería la ayuda
objeto de configuración de columna:
<ReactTable
data={this.state.data}
columns={[
{
Header: 'Name',
accessor: 'name'
},
{
Header: 'Age>18',
accessor: d => d.isAgeAbove18.toString(); // this does not work
},
{
Header: 'TimeStamp',
accessor: d => d.timeVal.toString(); // this does not work
},
]}
/>
Respuesta #1
Al mirar la documentación de las tablas de React, dice que necesitas proporcionar la propiedad id siempre que el tipo de accesor no sea una cadena. Por lo tanto, el formato actualizado debería ser este.
columns={[
{
Header: 'Name',
accessor: 'name'
},
{
id:'age' // add this
Header: 'Age>18',
accessor: d => d.isAgeAbove18.toString();
},
{
id: 'timestamp' // add this
Header: 'TimeStamp',
accessor: d => d.timeVal.toString();
},
]}
Respuesta #2
Creo que esta es la mejor solución en caso de que estés usando filtros,
id: 'available',
Header: "Available",
accessor: d => { return d.available ? 'Available' : 'Not available' },
filterable: true,
Filter: () => (
<select className='form-control' value={this.state.availability_value} onChange={(e) => this.applyFilter(e.target.value)} >
<option value={`{ "available": "" }`}>Select</option>
<option value={`{ "available": "" }`}>All</option>
<option value={`{ "available": "1" }`}>Available</option>
<option value={`{ "available": "0" }`}>Not available</option>
</select>
)
