在反应中抓取选定的单选按钮值答案

【问题标题】：Grabbing the selected radio button value in react在反应中抓取选定的单选按钮值
【发布时间】：2021-05-02 08:50:03
【问题描述】：

我试图从 4 个单选按钮（同名）中获取选中单选按钮的值。这都在功能组件内部。但是在获取值时遇到了一些麻烦。

{details.map(questions => {
            const { counter, question, option1, option2, option3, option4, crr_option } = questions

            return (
                <div key={counter}>
                    <h2>{counter}. {question}</h2>
                    <div className="q-cont">
                        <div className="radio-cont">
                            <label htmlFor="op1">{option1}</label>
                            <input label={option1} type="radio" name="op" id="op1" />
                        </div>
                        <div className="radio-cont">
                            <label htmlFor="op2">{option2}</label>
                            <input type="radio" name="op" id="op2" />
                        </div>
                        <div className="radio-cont">
                            <label htmlFor="op3">{option3}</label>
                            <input type="radio" name="op" id="op3" />
                        </div>
                        <div className="radio-cont">
                            <label htmlFor="op4">{option4}</label>
                            <input type="radio" name="op" id="op" />
                        </div>
                    </div>
                </div>
            );
        })}

【问题讨论】：

标签： javascript html reactjs input

【解决方案1】：

很简单，您需要为每个单选按钮提供一个value 属性和一个onClick 侦听器，以收集结果。我在这里创建了一个最小的工作示例：

Handling click events of radio-buttons in React

【讨论】：