如何在单击按钮时禁用<react-date-picker>组件
如何在单击按钮时禁用<react-date-picker>组件
提问于 2017-12-13 00:59:56
我使用了来自react-date-picker.的日期选择器组件我需要禁用整个日期控件和按钮本身在一次按钮单击。按钮确实被禁用了，但DatePicker组件没有。我尝试了以下方法，但没有起作用。有没有正确的方法呢？
import DatePicker from 'react-date-picker';
...
...
this.state = {
disabledDate: false
}
...
...
...
noDateRememberButtonClick() {
this.setState({
disabledDate: true
});
}
render() {
return(
<div className="wrapper">
<div className="date-picker">
<DatePicker
onChange={this.dateOnChange}
value={this.state.boughtDate}
disabled={this.state.disabledDate} />
</div>
<button className="btn" onClick={this.noDateRememberButtonClick} disabled={this.state.disabledDate} type="button"> {BUTTON_LABEL}</button>
</div>
)}回答 4
Stack Overflow用户
回答已采纳
发布于 2017-12-13 02:00:06
react-date-picker不支持disabled属性。请参阅https://github.com/wojtekmaj/react-date-picker
根据shaz的建议，如果您希望使用react-datepicker (https://github.com/Hacker0x01/react-datepicker/blob/master/docs/datepicker.md)组件，则可以使用该组件
Stack Overflow用户
发布于 2020-07-17 16:56:32
<DatePicker
ref={endCalendarRef}
readOnly={true}
.....
/>Stack Overflow用户
发布于 2019-04-24 03:08:20
尝尝这个。对我很管用
const CustomInput = (props) => {
return (
<input
className={[classes.TransparentInput, "uk-input"].join(" ")}
onClick={props.onClick}
value={props.value}
type="text"
readOnly={true}
/>
)
}
<DatePicker
customInput={<CustomInput />}
name={'from'}
value={values['from']}
onChange={e => setFieldValue('from', moment(e).format('L'))}
/>setFieldValue来自formik。您可以选择不使用formik。你自己选吧。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/47777871
复制相关文章
相似问题