多个按钮关闭在reactjs中不起作用

【问题标题】：multiple button close not working in reactjs多个按钮关闭在reactjs中不起作用
【发布时间】：2020-02-18 07:52:09
【问题描述】：

我有一个日期选择器，日期显示在带有按钮关闭（x）的文本字段中。在从 datepicker 中选择日期时，将添加日期，如图所示，

但是关闭按钮不起作用，单击关闭时，应删除特定日期字段。关联 https://codesandbox.io/s/strange-http-zhj4f?fontsize=14&hidenavigation=1&theme=dark

【问题讨论】：

在我控制 val 时在 textareaHandler() 中。为什么要打印 12-02-2020 ？对于功能 buttonHanlder() 你必须提供默认值而不是 null
@DeepKakkar 感谢您的回复，对代码进行了更改
@Senthil 您的 onChange 方法似乎有问题。我将您的 onChange 处理程序更改为文档的工作方式和工作方式。看看codesandbox.io/s/confident-wilbur-cnbnr

【解决方案1】：

稍微修改一下你的代码。

<DatePicker
     locale="en-GB"
     onChange={this.buttonHanlder}
     value={this.state.closedate}
/>

在你的 buttonHandler 方法中，使用下面的代码

buttonHanlder = value => {
    if (value) {
        var dateformat = [
            ("0" + value.getDate()).slice(-2) +
            "-" +
            ("0" + (value.getMonth() + 1)).slice(-2) +
            "-" +
            value.getFullYear()
        ];
        this.setState(prevState => ({
            closedate: value,
            closedatearr: [...prevState.closedatearr, ...dateformat]
        }));
    } else {
        this.setState({
            closedate: ''
        });
    }
};

这样做的原因：当您单击 X（关闭按钮）时，react-date-picker 调用 buttonHandler 并返回 null 值，这意味着用户已清除日期.所以你需要根据你的要求处理空值。

【讨论】：