Question

我在RadioButton组件下方

import React from 'react';

export default class RadioButton extends React.Component {
    constructor(props) {
        super(props);
        this.handleChange = this.handleChange.bind(this);
        this.state = {
            selectedRadioButton :'Fact'
        }
    }

    handleChange = (event) =>{
        this.setState({
            selectedRadioButton : event.target.value
        });
       this.props.handleSelect(event);       
    } 

    render() {
        console.log('im in render',this.state.selectedRadioButton);
        return (
            <div>           
            <input type="radio" name="value"  value={this.props.value} onClick={ e => this.handleChange(e) } 
                  checked={this.props.value === this.state.selectedRadioButton ? true : false}/>
            <label>{this.props.value}</label>
            </div>

        );
    }
}

我在“ BaseMeasure”组件中使用单选按钮，如下所示：

handleRadioSelect = (event) => {
        console.log('base measure event',event.target);       
        this.props.checkedRadioValue(event);
    }
<RadioButton value="Fact"  handleSelect = { this.handleRadioSelect }/>
<RadioButton value="Dimension" handleSelect = { this.handleRadioSelect } />

在其他文件中将BaseMeasure组件用作

checkedValue(event) {
        console.log('in editor',event.target.value);
         this.setState({selectedRadioValue: event.target.value});
         if(this.state.selectedRadioValue === 'Dimension' ){
             this.fetchAllFieldsOnTablesRelatedToFactTable();
         }
         else{
             this.fetchFieldsOnOneFactTable();
            }
    }

    <BaseMeasure factTableData={ this.state.baseTablevalues } 
                                             diagnosisData = {this.state.diagnosisValues}  
                                             checkedRadioValue = {this.checkedValue}/>

选择单选按钮后无法在用户界面中查看检查值

Answer 1

当您单击按钮时状态是否正在改变？

单选按钮的选中值未突出显示

1 个答案: