将修改器类应用于数组中的指定项[React] 上面是我在React中为表组件编写的Javascript 下面是修改器对应的CSS

有人知道我如何将修改器仅应用于阵列中的某些头部项目吗？谢谢。

我建议使用“”包在React内部应用BEM，因为向组件添加条件类/修饰符要容易得多。但要回答你的问题，我可能会这样做：

head: {
    className: '',
    columns: ['Name', 'Title', 'Position', 'Company'],
    center: true,
  },

cp-table-head--center {
  text-align: center;
}

回答您关于将特定标题项居中的问题。。您可以将上述

桌面组件与..一起使用：

className={`cp-table-head${center ? '--center' : ''}`}

。。。
常数表=（）=>{
常量列=[
{
标题：“姓名”，
中：是的，
},
{
标题：“标题”，
中锋：错，
},
{
标题：“职位”，
中：是的，
},
{
标题：“公司”，
中锋：错，
}
];
const headers=columns.map（（头，索引）=>(
));
...
如何渲染它？
className={`cp-table-head${center ? '--center' : ''}`}

...
const Table = () => {
  const columns = [
    {
      title: 'Name',
      center: true,
    },
    {
      title: 'Title',
      center: false,
    },
    {
      title: 'Position',
      center: true,
    },
    {
      title: 'Company',
      center: false,
    }
  ];

  const headers = columns.map((header, index) => (
    <TableHead key={index} title={header.title} center={header.center} />
  ));
...