React Bootstrap Table:基于值更改背景颜色的内联样式

import React from 'react';
import { Table } from 'react-bootstrap';

function MyTable() {
  const data = [
    { name: 'Alice', value: 50 },
    { name: 'Bob', value: 120 },
    { name: 'Charlie', value: 80 },
  ];

  return (
    <Table striped bordered>
      <thead>
        <tr>
          <th>Name</th>
          <th>Value</th>
        </tr>
      </thead>
      <tbody>
        {data.map((item, index) => (
          <tr key={index}>
            <td>{item.name}</td>
            <td className={item.value > 100 ? 'highlight' : ''}>{item.value}</td>
          </tr>
        ))}
      </tbody>
    </Table>
  );
}

export default MyTable;

.highlight {
  background-color: red;
}