我試圖用另一個數組(this.props.notPressAble)更改映射數組中所選對象的類名。這是因為我希望數組中的一些對象具有另一種css樣式

handleOptions = () =>{
    let array = this.props.options.map((option, i) => 
    <a 
    key={i} 
    className={classes.dropdownoptions}>
    {option}</a>)

    for(let x = 0; x < this.props.options.length; x++)
    {
        if(this.props.notPressAble !== undefined)
        {
            for(let y = 0; y < this.props.notPressAble.length; y++)
            {
                if(x == this.props.notPressAble[y])
                {
                    array[x].props.className = classes.dropdownoptionsnotpressable
                }
            }
        }
    }

    return array
}

下面的代碼是我實現這個類的地方，以便讀者更好地理解我的問題

<SideBarContainers name="Planering" notPressAble={[0, 6, 11]}
 options={[
     "Aktiviteter:",
     "+ Ny Aktivitet",
     "Visa Alla ?ppna",
     "Visa F?rsenat",
     "Visa Alla St?ngda",
     "Visa Alla Kategoriserat",
     "Att g?ra:",
     "+ Ny Att g?ra",
     "Visa Alla ?ppna",
     "Visa Alla St?ngda",
     "Visa Alla Kategoriserat",
     "Personal planering:",
     "+ Ny post",
     "Visa Alla enkel"

]}/& gt；

我遇到的問題是array[x].props.className是一個只讀值，不能更改。有沒有別的方法做這件事？

為什么使用for循環來循環選項，然后不可按。你可以使用includes函數來決定應用哪個類。

handleOptions = () => {
    let array = this.props.options.map((option, i) => {
      const cls = this.props.notPressAble.includes(i) ? classes.dropdownoptionsnotpressable : classes.dropdownoptions
      return (
        <a key={i} className={cls}>
          {option}
        </a>
      )
    });

    return array;
  };

如果你仍然想使用你當前的代碼，那么你需要克隆你想要改變的元素，然后做出如下的改變。

//array[x].props.className = classes.dropdownoptionsnotpressable
array[x] = React.cloneElement(array[x], {className: classes.dropdownoptionsnotpressable});