javascript - 如何使复选框在反应中表现得像单选按钮

Question

如何使引导复选框在反应中表现得像单选按钮？我在表中有一个动态加载行，每行都包含接受和拒绝复选框，我希望这些复选框的行为类似于单选按钮。我不能使用单选按钮，所以需要一种方法来使复选框的行为类似于单选按钮。

                    <div className="custom-control custom-checkbox">
                      <input
                        type="checkbox"
                        className="custom-control-input"
                        id={page + item.RowKey + "Accept"}
                        name={page + item.RowKey + "Accept"}/>

                      <label
                        className="custom-control-label"
                        htmlFor={page + item.RowKey + "Accept"}>

                        Accept
                      </label>
                   </div>
                   <div className="custom-control custom-checkbox">
                      <input
                        type="checkbox"
                        className="custom-control-input"
                        id={page + item.RowKey + "Reject"} />
                      <label
                        className="custom-control-label"
                        htmlFor={page + item.RowKey + "Reject"}>

                        Reject
                      </label>
                   </div>

标签： javascriptreactjs

Answer 1

您可以使用ref复选框，并且onClick对于每个复选框，ref您可以取消选中该框。

以下是关于 ref 的一些文档：https ://reactjs.org/docs/refs-and-the-dom.html