【发布时间】:2021-03-24 11:43:59
【问题描述】:
我在整个网络上都看到过这个问题,但没有什么可以给我一个有效的解释。
我正在使用 Material-UI Select 和来自 React 的优秀的 setState(...)(虽然不是钩子)
我的组件基本上由这些行组成:
class MyComponent extends Component {
exportOptions = ['CSV','SDF']
constructor(props) {
super(props);
this.state = {
[...]
formatToExportTo : this.exportOptions[0]
};
[...]
<Select value={this.state.formatToExportTo}
style={{width : "10em"}}
onChange={event=> {
this.setState({formatToExportTo : event.target.value})
}}>{
this.exportOptions.map(f=><MenuItem key={f} value={f}>{f}</MenuItem>)
}</Select>,
我的问题是我的 Select 组件在选择另一个选项后没有更新其值。
到目前为止我已经尝试过:
-
setState({...this.state, formatToExport : event.target.value})在 Select 的onChange=和 Select 标签中:value = {this.state.formatToExport} -
setState({...this.state, formatToExport : event.target.value})在每个选项的onClick=和 Select 标签中:value = {this.state.formatToExport}。但这只是为了查看更新,因为 event.target.value 反正也不对 - 以及我上面写的当前版本的行也是 onClick 或 onChange(没有应该由 setState 单独完成的状态克隆)。
就像在官方示例中一样,所以我真的看不出这种缺乏更新的原因。无论我尝试什么,Select 组件的当前显示值都不会改变是 display,即使状态已正确更新
感谢您花时间阅读我!
【问题讨论】:
标签: javascript reactjs material-ui state