gpt4 book ai didi

reactjs - 在 Material UI 库中以编程方式打开日期/时间选择器

转载 作者:行者123 更新时间:2023-12-03 14:04:33 26 4
gpt4 key购买 nike

我正在做一个使用 React 和 Material Design 的项目。我想和 Material UI 一起去,因为我需要精美的数据和时间选择器,该库将其作为组件提供。

由于我必须在应用程序中的特定步骤中设置开始时间、结束时间和日期,因此我想从一个选择器“跳跃”到下一个选择器以减少用户必须进行的点击,即

  • 点击“开始日期”输入字段
  • 选择器打开,选择日期
  • 第一个选择器的关闭应打开下一个选择器(开始时间)
  • 关闭它会打开下一个选择器(结束日期)
  • 关闭它会打开下一个选择器(结束时间)

我知道如何在这些事件上触发函数,但我不知道如何以编程方式打开选择器。

在相应元素上尝试使用 jQuery(...).click() 或 .focus() 进行“肮脏的伎俩”,但没有成功。

最佳答案

我解决了这个问题,为每个datepicker添加了ref

handleChangeDPOne(){
this.refs.datePickerTwo.openDialog()
}

handleChangeDPTwo(){
// something
}

render(){
return (
<div>
<DatePicker ref='datePickerOne' onChange={this.handleChangeDPOne} />
<DatePicker ref='datePickerTwo' onChange={this.handleChangeDPTwo} />
</div>
)
}

希望对您有所帮助。

关于reactjs - 在 Material UI 库中以编程方式打开日期/时间选择器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39619020/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com