问题标签 [react-big-calendar]

我正在使用 BigCalendar react-big-calendar，并且我试图找到一个示例，说明如何在 defaultDate 状态值更改时导航到特定的日期/月份。

我想知道 BigCalendar 日历是否支持导航到特定的日期/月份，文档包括onNavigate道具，但我无法使其工作。

谢谢

我有一系列事件被发送到 react-big-calendar

它们具有以下格式：

我希望 react-big-calendar 将event.clientData.date用作它为每个事件显示的日期。

目前日历被渲染为空。

从阅读文档看来我需要使用startAccessor道具来实现这一点。我尝试了以下方法：

那是行不通的（我认为不会）。如果有人可以提供帮助，将不胜感激！

文档提到能够创建自定义组件：http: //intljusticemission.github.io/react-big-calendar/examples/index.html#prop-components

我试过：

在哪里EventComponent：

但我得到的错误是：

和

那我该怎么办？

我正在使用 React Big Calendar，并且能够使用culture="sv-SE" 和按钮将语言更改为瑞典语：messages={{next:"xxx",previous:"xxx",today:"xxx"}} .

但是，弹出按钮“+X more”仍然是英文的。是否可以使用消息道具或其他东西来改变它？

在尝试制作演示预约系统时，我遇到了一个奇怪的情况。我想通过 Django 后端 rest api 获取事件，它工作得很好，我也可以看到控制台中的数据。

这是我的索引文件（提供者所在的位置）： https ://hastebin.com/ubefumofor.js

我的日历渲染组件： https ://hastebin.com/oronefibap.scala

我的 Redux，我正在使用它的 reduxsauce 库： https ://hastebin.com/usetavasub.js

我的 ReduxSaga 文件： https ://hastebin.com/wutuvelefi.js

现在，问题是，在获取事件后，我正在努力做一些事情：

• 如果我在 componentWillUpdate 或 componentDidUpdate 中调用它，它会在哪里设置状态？

• 如果我使用 this.props.events，我会收到以下错误，我已将其作为图片附加。它说uncaught at fetchEventsByDoctor The sort method cannot be invoked on an Immutable data structure.

现在我知道道具不能修改，状态可以。

有什么建议可能是错的吗？谢谢

注意：我是 react 和 redux 相关技术的新手。

解决方案

这应该可以解决问题，但下面 Nagaraj 的回答也是一个很好的工作解决方案。

嗨，即使它显示在 react-dev 工具中，我也看不到月视图。周视图工作正常，但月视图不显示任何内容。PFA 下面的代码。

这是周视图图像。

这是月视图图像。

对于我要导入的一些模块，我最终会修改它们的声明文件以使其正常工作。我不确定我是否做错了，或者这些模块的类型是否恰好有问题。

索引.tsx

react和moment进口罚款。问题在于react-big-calendar和react-modal。这基本上是我经历的过程react-modal：

我安装了@types/react-modal.

node_modules/@types/react-modal/index.d.ts（缩写）

我试过import ReactModal from "react-modal"了，这给了我Module '...' has no default export。

我试过import { ReactModal } from "react-modal" 了，这给了我Module '...' has no exported member 'ReactModal'。

我尝试import * asReactModal from "react-modal" 了 which 编译，但Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object在运行时给了我。

最终我只是将声明文件更改为：

然后我可以使用import ReactModal from "react-modal"，它工作。

随着react-big-calendar我刚刚卸载@types/react-big-calendar，现在有我自己的打字。当然，其他人正在为这些包使用这些声明文件而没有这些麻烦。任何指导将不胜感激。

包.json

tsconfig.json

单击事件时，我无法将弹出框添加到事件中。弹出框似乎只出现在事件槽中，而不是在事件槽的顶部。此外，由于我为事件创建了一个自定义组件并尝试在自定义组件中实现弹出框，因此只有在我单击事件名称时才会显示弹出框。

这是代码：

在日历中，道具components={{event:CustomEvent}}。

我在 sharePoint Web 部件中使用了一个反应大日历。因此，来自大日历外部 css 的这种样式隐藏了我的月历：

我得到以下图片： 所以当我从 chrome 中禁用此样式时，没关系： 我尝试从我自己的 css 中禁用此样式，但它不起作用：

那么我如何通过其他方式禁用这种样式呢？

我想像月份一样在周/日视图中显示标题，但库会自行插入它。如何获得“4:54 PM - 7:54：在单元格的头部？