Question

我试图学习使用React。我的实验进展顺利，直到我尝试使用2个单选按钮。下面的代码显示两个按钮都是＆＃34; on＆＃34;当我期待＆＃34;或＆＃34;按钮是＆＃34;关闭。关于我做错了什么想法？

import React from 'react';

class SearchBar extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            operator: 'And',
            andSelected: 'true',
            orSelected: 'false'
        }
    }


    render() {
        return (
            <div className="search-bar">     
                <input type='radio' group='andor' defaultChecked={this.state.andSelected} />
                And
                <input type='radio' group='andor' defaultChecked={this.state.orSelected} />
                Or
            </div>
        )
    }
}

export default SearchBar;

注意：我删除了点击处理程序，以便使损坏的代码更易于诊断。

Answer 1

defaultChecked道具需要boolean。传递非空 string将始终评估为true - 无线电将设置为已检查。

this.state = {
  operator: 'And',
  andSelected: true,
  orSelected: false
}

使用React设置radiobuttons时出现问题

1 个答案: