Having a little issue that's causing me some trouble. I have a React Bootstrap Table displaying data from an API, and I'm looking to enhance it by changing the row color to green if a specific value is greater than zero. Here is an example:
const TableComponent = ({ fixtures }) => {
return (
<Table>
<tbody>
{fixtures.map((fixture) => (
<tr
key={fixture.id}
style={{
backgroundColor: 'green'
}}
>
<td> {fixture.value1} </td>
</tr>
))}
</tbody>
</Table>
);
};
Currently, the row's backgroundColor is set to green by default. Is it feasible to create a function so that if fixture.value2 or fixture.value3 is greater than zero, the row's backgroundColor remains green, but reverts to default otherwise?