Aleksander  Sołop Aleksander Sołop - 3 years ago 118
HTML Question

How to sort HTML Table in ReactJS

I have

array
of
Objects
and I add my data to
HTML Table
. Now I need to sort my data by version. How can I do something like that in
React
?

render() {
return (
<div>
<div>
<Label> We got {this.state.count} elements in our database. </Label>
</div>
<div>
<Table hover striped bordered responsive size="sm" >
<thead>
<tr>
<th>VERSION</th>
<th>DATE</th>
<th>UUID</th>
</tr>
</thead>
<tbody>
{this.state.results.map(result =>
<tr key={result.fileId}>
<td>{result.VERSION}</td>
<td>{result.ORIGIN}</td>
<td>{result.UUID}</td>
</tr>
)}
</tbody>
</Table>
</div>
</div>
);
}
}


Maybe I can use some
js
script, but tell me how to use it, I'm new with
ReactJS
. My version for is
0.26.8
for example.

Answer Source

I would use lodash's sortBy() function here:

https://lodash.com/docs/4.17.4#sortBy

const sorted = _.sortBy(this.state.results, 'VERSION')

Then map over sorted instead of the this.state.results

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download