我需要将2行表值与Reactjs进行比较

我是新手

我用我的手做了一张桌子。下面是示例图片

我想比较每列的值。例如，1与10（a列），2与20（b列），30与5（c列）。然后要添加css更改

但我找不到这样做的方法。请帮帮我

我的代码如下

// Table Main code
// Maintable code

import React, { useState, useEffect } from "react";
import TableRow from "./TableRow"
import './ManageTable.css'


const ManageTable = (props) => {
    const headerMeta = ['a','b','c'
    ];

    const [tableData, setTableData] = useState([{ a: 1,b:2,c :30 },{ a: 10,b:20,c :5 },]);

    return (
        <>
       
        <div>
            {tableData.length !== 0 && (
            <table>
                <thead>
                <tr>
                   {headerMeta.map(i=><th>{i}</th>)}
                </tr>
                </thead>
                <tbody>
                {tableData.map((d, i) => {
                    return (<TableRow key={i} data={d}/>);
                }
                )}
                                
                </tbody>
            </table>
            
            )}
        </div>
        </>
    );
}
export default ManageTable

//表主代码
//主表代码
从“React”导入React，{useState，useffect}；
从“/TableRow”导入TableRow
导入“./ManageTable.css”
const ManageTable=（道具）=>{
const headerMeta=['a'，'b'，'c'
];
const[tableData，setTableData]=useState（[{a:1，b:2，c:30}，{a:10，b:20，c:5}，]）；
返回(
{tableData.length！==0&&(
{headerMeta.map（i=>{i}}
{tableData.map（（d，i）=>{
返回（）；
}
)}
)}
);
}
导出默认管理表

//行代码文件
从“React”导入React，{useState，useffect}；
导入“./TableRow.css”
const TableRow=（{key，data}）=>{
const[RowData，setRowData]=useState（数据）；
返回(
{RowData.a}
{RowData.b}
{RowData.c}
)
};
导出默认表行；

---

请帮助我

正如您所看到的，有一个处理逻辑的更改函数。 您需要有if-else才能将true标志发送到altercschange

Altercschange可以决定css的用途

var变化=（索引）=>{
//如果要更改第一行，则索引将为0。
如果（索引==1）{
//编写代码进行比较
if（tableData[0].a==tableData[1].a）{
//你可以在这里添加你的逻辑。
//返回标志true或false
}
}
}
返回（……）。。。。。。。
{
tableData.map（（d，i）=>{
返回；
})
}
)
const TableRow=（{key，data，alterCssFlag}）=>{
//使用alterCssFlag更改以下元素中的css
const[RowData，setRowData]=useState（数据）；
返回(
{RowData.a}
{RowData.b}
{RowData.c}
)
};

您要进行的css更改是否有两种状态？e、 g如果tabledata[0].a===tabledata[1].a大于true或false？如果是真的，那就改变颜色或者什么都不改变。提供更多信息。是的，这就是我所需要的。我想比较每列的值。然后要更改单元格的背景或字体颜色。谢谢你的回复。让我知道它是怎么回事。它不起作用。如果我遵循您的代码，则第一行和第二行将发生更改。我只想改变2行中的一行。酷比你写一个简单的条件，如果索引是1比返回真加上额外的条件来改变颜色，我会更新代码在while@omaeya我刚刚将索引从0更改为1，只有当索引为1时才会返回true，在所有其他条件下，它将为false，因此您可以控制索引1

//Row code file

import React, { useState, useEffect } from "react";
import './TableRow.css'

const TableRow = ({ key, data}) => {
    const [RowData, setRowData] = useState(data);

    return (
                <>
        <tr key={key}>
            <td>{RowData.a}</td>
            <td>{RowData.b}</td>
            <td>{RowData.c}</td>
              
        </tr>
        </>
    )
};


export default TableRow;