Question

当我使用来自componentDidMount()的数据加载ToggleButtonRadio组件时，componentWillReceiveProps(nextProps)似乎填充了未定义，然后在数据通过时不会更新。如果数据来自defaultValue，则在创建组件时设置constructor(props)时，组件将按预期工作。我没有收到错误，所以我无法弄清楚我错过了什么。

这是react-bootstrap组件。

组件：defaultValue

ToggleButtonRadio

Page：const ToggleButtonRadio = (props) => ( <div> <ButtonToolbar key={props.name}> <ToggleButtonGroup type="radio" name={props.name} defaultValue={props.selectedOption}> {props.options.map(opt => <ToggleButton key={opt} value={opt} onChange={props.controlFunc}>{opt} </ToggleButton> )} </ToggleButtonGroup> </ButtonToolbar> </div> );

JobDetailsPage

Answer 1

似乎有效的解决方案是添加密钥。

<ToggleButtonRadio
 key={this.state.contractType ? 'loaded' : 'notLoaded'}
 options={['Permanent', 'Part time', 'Contract', 'Temp']}
 name={'contractType'}
 label={'Contract type'}
 controlFunc={this.handleInputChange}
 selectedOption={this.state.contractType}
/>

无法设置ToggleButtonGroup的defaultValue

1 个答案: