reactjs 在地圖功能內切換啟用/禁用按鈕

Question

我有一個地圖功能，可以旋轉兩個按鈕A和D 。

我的問題是我試圖切換 A 和 D 的活動狀態。由於它在循環內，如果我更改一行的狀態，它也會影響其他行。 什么是最干凈的方式來實現 tis.

 {props.fileNamesStatus.map((file) => {

                                return <li>
                                    <div class="btn-group">
                                        <input type="button" className="btn btn-secondary" value={file.fileName}></input>
                                        <input type="button" value="A" className={`btnA ${file.fileStatus === 'A' ? 'btnDisable' : ''}`} onClick={handleChangeFileStatus}></input>
                                        <input type="button" value="D" className={`btnD ${file.fileStatus === 'D' ? 'btnDisable' : ''}`} onClick={handleChangeFileStatus}></input>
                                    </div>
                                </li>
                            })}

我的問題是我想在按鈕A和D之間切換。 所以當我點擊A ， D應該是活動的，當我點擊D ， A應該是活動的。

Answer 1

我想我可以給你一個主意。 嘗試這樣的事情，

<input type="button" value="A" className="btnA" disabled={file.fileStatus === 'A'} onClick={handleChangeFileStatus}>
</input>
<input type="button" value="D" className="btnD" disabled={file.fileStatus === 'B'} onClick={handleChangeFileStatus}></input>

希望這適合您的情況。