问题标签 [react-datepicker]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
1135 浏览

javascript - React-datepicker 不渲染,变体错误

我被一个问题困住了 2 到 3 天。 问题

这是我的 package.json 文件

这就是我导入日期选择器的方式:

这就是我在渲染函数中使用它的方式:

当我移除道具时它不起作用,但是当我移除整个组件时,一切都按预期工作。我试图删除package-lock.json和 node_modules 并重新运行 npm install 但仍然无法正常工作。

节点版本是:v8.11.3 NPM 版本是:v6.4.1

0 投票
1 回答
1420 浏览

javascript - 要单击图像图标,react-datepicker 的输入框不起作用

伪代码中,我正在使用我的 datePicker 的图像图标,它正在以动作打开。但是当我点击 IMAGE-icon 时,它的事件不会持续存在。

layerIndex 有问题,图像出现在输入框的顶部,因此在输入更改时不会发生事件。

0 投票
2 回答
2671 浏览

javascript - 默认值在反应 DatePicker 中不起作用

我用过react-datepicker。我遇到了一些问题。defaultValue={updateData.date} 不起作用。它不显示数据。如果使用value="{updateData.date}"则显示数据但无法编辑。我该如何解决这个问题?另外,还有另一个问题如果我使用了 placeholderText,它的显示和工作正常,但在控制台中显示错误。 控制台错误

0 投票
1 回答
6153 浏览

reactjs - 比较反应中的两个日期

我正在使用反应日期选择器。是文档链接。

我有两个日期输入框。一个用于“开始日期”,另一个用于“结束日期”。我需要的是结束日期不小于开始日期。

我正在运行以下无法正常工作的代码。

谁能帮我解决这个问题。

0 投票
0 回答
1029 浏览

javascript - 如何从 react-datepicker 2.0.0 输入中获取字符串值?

努力从 React/Redux 应用程序中的 react-datepicker 获取日期作为字符串。后端服务将日期字段作为特定于前端用户语言设置格式的字符串进行操作。因此,在 Redux 中将日期存储为字符串更容易。

在 2.0.0 之前的版本中,react-datepicker 使用时刻对象操作,并且可以使用momentDate.format()执行转换。

2.0.0 版使用原版 JS 日期。react-datepicker使用未导出的内部方法 ( ) 执行string<->转换。无法访问这些功能。DateformatDate

目前正在使用 moment.js 执行转换的解决方法。方法有缺点:

  • moment.js 和 react-datepicker 格式掩码不匹配(例如不同的字母大小写)
  • 额外的库依赖(moment.js)

当前代码:

访问 react-datepicker 2.0.0 输入字符串值的推荐解决方案是什么?

0 投票
2 回答
3949 浏览

reactjs - 具有多个名称属性的 React-Datepicker handleChange

我有 6 个使用 React-Datepicker 的表单输入。我需要使用 handleChange() 来设置状态 6 次,但我不明白如何从每个表单输入动态获取名称属性,因为“日期”在通过函数传递时不包含任何其他数据。我试过传递“名称”,但它不起作用。handleSelect() 也是如此

我也试过这个:https ://github.com/Hacker0x01/react-datepicker/issues/242没有任何运气。

任何帮助都是极好的!

0 投票
2 回答
804 浏览

javascript - 反应 onChange 方法不改变对象的状态

我正在使用 react-date-picker,我想将它创建为一个日期选择器组件,我可以在页面的每个部分使用它。onchange 方法是我遇到问题的地方,因为在状态更改时,它不知道它正在更改的列。我在 onchange 方法中遗漏了一些东西。当我选择一个日期时,错误是状态总是为空。这是我控制台中的结果。

21/12/2018

这就是我在另一个组件中调用它的方式

0 投票
3 回答
14859 浏览

reactjs - 如何在 react-datepicker 中自定义样式?

我想改变 react-datepicker 的风格:

1.修改输入框为自定义样式

2.更改日历的样式和语言

我看到一篇帖子(关于 datepicker 的自定义输入字段,[react-datepicker 组件] https://github.com/Hacker0x01/react-datepicker/blob/master/docs/datepicker.md)谈论替换整个组件。我可以直接编辑样式而不编写新组件吗?如果是,我怎样才能做到这一点?此外,我不知道如何更改日历。如何找出我应该更改哪个组件?

编辑 8nm3x4y300

0 投票
3 回答
7567 浏览

reactjs - 在移动屏幕上反应日期选择器切割日历

我正在使用react-datepicker

我在一行中有两个日期选择器,它在桌面屏幕上运行完美,但是在移动屏幕上使用它时,日历从右侧切割,因为它没有从右侧获得足够的空间。

此外,它也没有显示滚动条滚动到右侧

下图是它在手机上的样子。

image_on_mobile

0 投票
1 回答
901 浏览

javascript - 在反应日期选择器中显示突出显示的日期

我在我的反应组件中使用反应日期选择器。我必须显示来自 api 的突出显示日期。我从 api 获取日期数组,如下所示:

 ["2019-01-03T18:30:00.000Z","2019-01-03T18:30:00.000Z"]

我在数组上方进行映射,并使用subDaysmap 函数中的函数来创建日期数组并将其传递给highlightDatesdatepicker 中的属性。但它给了我subDays 是未定义的错误。

谁能告诉我,我如何在 react datepicker 中突出显示来自 api 的日期?