如何使用更新的默认值重新呈现 DatePicker？

Question

我在以下场景中使用 DatePicker：

渲染使用了 DatePicker 的表单
在 componentDidMount 上，获取表单的保存信息（如果之前保存过）
将 DatePicker 的属性 defaultValue 从 undefined 设置为获取的值

看起来很简单。但是，由于 DatePicker 的行为是仅在第一次渲染时渲染 defaultValue，因此在获取值（第二次渲染）时显然是空的。

我看到的其他两个选项：

有一个受控组件 - 手动操作值（在获取时提供它，然后在 onChange 触发时更改它）
仅在没有要获取的内容（新表单）或数据已获取并准备好填充时才呈现 DatePicker。

关于实现此目标的最佳方法有什么想法吗？

Answer 1

更新：我不再使用 React，所以不想重新测试它，但我强烈怀疑它不再有效。

之前的回答

与其填充 defaultDate 道具，不如将 value 道具挂接到您想要设置的任何位置。使用这种方法，您还需要连接一个 onChange 处理程序。它看起来像这样：

onChange(event, newValue) {
  this.setState({myDate: newValue})
},
render() {
  return (
    ...
    <DatePicker value={this.state.myDate} onChange={this.onChangeHandler}>
    ...
  )
},

或者，您可以使用 React 的 LinkedStateMixin 和 DatePicker 的 valueLink prop.

来使用双向绑定功能

如何使用更新的默认值重新呈现 DatePicker？

How do you re-render DatePicker with updated defaultValue?

javascript

reactjs

datepicker

material-ui

之前的回答