如何使用外部箭頭 function 將 styles 動態添加到物料表 RowData

Question

我對 React JS 很陌生，正在創建一個通用的 Excel 比較工具。 該工具獲取 2 個 EXCEL 文件，將它們轉換為 JSON arrays，並將它們輸入到材料表中，並添加了用於工作表遍歷 2 的單選按鈕（例如工作表文件 1）和工作表文件。 我有一個比較按鈕，它使用那些 json arrays 並比較它們的行內容，但我對如何在找到匹配項時將 styles 添加到材料表行感到困惑。 任何人都可以幫忙嗎？

比較按鈕 Function：

  const compareTables = (obj1,obj2)=>{
  const _ = require('lodash'); 
  const data1 = Object.values(obj1);
  const data2 = Object.values(obj2);
  console.log(data1);
  console.log(data2);
  if (!data1.length||!data2.length){
    alert('Missing Table Data')
  }else{
    //if table 1 has more cells than table 2
    if(data1.length>=data2.length){
    for (let i=0;i<data1.length;i++){
      if  (_.isEqual(data1[i],data2[i])){
        console.log("row match, table 1 bigger")
      }
      else{
        console.log("row does not match, table 1")
      }
    }
    }else{
      //if table 2 has more cells than table 1
      for (let i=0;i<data2.length;i++){
      if (_.isEqual(data2[i],data1[i])){
        console.log("row match, table 2 bigger")
      }
      else{
        console.log("row does not match, table 2 bigger")
      }
      }
    }
} }

我如何渲染材料表

 <div class="excelSpreadsheet1">
      <Paper className='excelPaper1' elevation={10}> 
      {sheetNames1?.map((s,index) => 
        <input type="radio" name="sheetNames1" value={s} key={index} onClick={()=>pageController1(file1,index)}></input>)}
        <h3 class='tabName1'>{thisSheet1}</h3>
       <MaterialTable id="mat1" title={fileName1} data={excelData1} columns={colDefs1}></MaterialTable>
      </Paper>
    </div>

如何填充初始化為空 useStates 的 excelData 和 colDefs：

 const importExcel1 = (e)=>{
 const file = e.target.files[0]
setFile1(file)
setFileName1(file.name)
console.log(file)
const reader= new FileReader()
reader.onload=(event)=>{
//data parsing
const bstr = event.target.result
const workBook=XLSX.read(bstr,{type:"binary"})
setSheetNames1(workBook.SheetNames)
//get first sheet
const workSheetName=workBook.SheetNames[0]//throw method here
setThisSheet1(workSheetName)
const workSheet=workBook.Sheets[workSheetName]
const fileData = XLSX.utils.sheet_to_json(workSheet,{header:1})
 //split data into 2 parts
const headers=fileData[0]
const heads=headers.map(head=>({title:head,field:head}))
console.log(heads)
setColDefs1(heads)
fileData.splice(0,1)
setExcelData1(convertToJson(headers,fileData))
}
reader.readAsBinaryString(file)
}

比較按鈕的樣子：

 <button className='compareButton' onClick={() =>compareTables(excelData1,excelData2)}> Compare</button>