Question

我正在使用react和react datepicker，并且希望能够使datepicker上的初始日期与输入框like so上的初始日期不同。我需要它们只有在它们是初始日期时才不同，如果用户选择一个新日期，则日期选择器上的日期和输入框上的日期应该与通常相同。我该怎么办？

Answer 1

日期选择器的

Custom input应该可以解决您的任务。

这是文档中示例代码的副本

class ExampleCustomInput extends React.Component {

    render () {
        return (
            <button
                className="example-custom-input"
                onClick={this.props.onClick}>
                {this.props.value}  // THis value will be displayed in input control
            </button>
        )
    }
}

ExampleCustomInput.propTypes = {
    onClick: PropTypes.func,
    value: PropTypes.string
};

...

<DatePicker
     customInput={<ExampleCustomInput />}
     selected={this.state.startDate}   // This value will be selected when datepicker control shows up
     onChange={this.handleChange} />

只需将<Button/>控件替换为<Input/>并对其进行样式设置。还可以从单个回调中管理this.props.value和this.state.startDate，以在用户在日期选择器中选择日期后使它们相同。

如何在日期选择器和输入框上设置不同的日期？

1 个答案: