在创建新事件时更新react-big-calendar组件
，可以通过以下步骤实现：
- 首先，确保已经安装了react-big-calendar组件。可以使用npm或yarn命令进行安装：
- 首先，确保已经安装了react-big-calendar组件。可以使用npm或yarn命令进行安装：
- 或
- 或
- 在你的React组件中引入react-big-calendar组件：
- 在你的React组件中引入react-big-calendar组件：
- 创建一个事件数组，用于存储日历中的事件数据：
- 创建一个事件数组，用于存储日历中的事件数据：
- 在你的组件中使用react-big-calendar组件，并传入事件数组和localizer：
- 在你的组件中使用react-big-calendar组件，并传入事件数组和localizer：
- 在这个例子中，我们使用了默认的startAccessor和endAccessor属性，它们分别指定了事件对象中的开始时间和结束时间字段。你可以根据你的数据结构进行调整。
- 现在，当你创建新事件时，你需要更新事件数组并重新渲染react-big-calendar组件。你可以在适当的地方添加一个处理函数来处理创建新事件的逻辑：
- 现在，当你创建新事件时，你需要更新事件数组并重新渲染react-big-calendar组件。你可以在适当的地方添加一个处理函数来处理创建新事件的逻辑：
- 在这个例子中，我们使用了useState钩子来更新事件数组。你可以根据你的项目需求使用适当的状态管理工具。
- 最后，你可以在你的组件中调用handleCreateEvent函数来创建新事件：
- 最后，你可以在你的组件中调用handleCreateEvent函数来创建新事件：
- 通过点击"创建事件"按钮，你可以调用handleCreateEvent函数来创建新事件，并更新react-big-calendar组件。
这样，当你创建新事件时，react-big-calendar组件会自动更新并显示新的事件。你可以根据需要进行进一步的定制和样式调整。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
- 腾讯云云数据库 MySQL 版：https://cloud.tencent.com/product/cdb_mysql
- 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos
- 腾讯云人工智能：https://cloud.tencent.com/product/ai
- 腾讯云物联网平台（IoT Hub）：https://cloud.tencent.com/product/iothub
- 腾讯云移动开发：https://cloud.tencent.com/product/mobile
- 腾讯云区块链服务（BCS）：https://cloud.tencent.com/product/bcs
- 腾讯云元宇宙：https://cloud.tencent.com/product/mu
相关·内容
我正在使用react-big-calendar，希望当用户将鼠标拖到日历上以选择日期/时间范围时，能够创建新事件创建事件演示。 但是，我编写的代码不会在成功创建事件时重新呈现组件。用户可以创建一个新事件，如果用户选择另一个视图(例如议程)，则会显示该事件，然后会出现在所有视图中。但是，根据演示，它不会立即显示在当前视图中。/App.css&#x
浏览 60提问于2020-07-31得票数 1
回答已采纳
在Android设备中，我用chrome浏览器调试了它，但它没有工作。在IOS设备中，我使用Safari浏览器进行了调试，该浏览器也不起作用。在电脑浏览器中，点击它的时候会很流畅，但在手机上却不是。
浏览 1提问于2019-02-07得票数 4
我正在尝试实现react大日历，但是我在添加事件和使用设置状态更新事件时遇到了问题。我创建了一个日历组件，然后使用句柄选择函数获取新事件并设置状态，但我不确定如何正确设置状态。当前错误是 TypeError:无法读取未定义的属性“”setState“” import React, { useState } from "react";
import "react-big-calendar/even
浏览 12提问于2021-07-08得票数 0
回答已采纳
2回答
看起来您可以为react日历组件创建自定义组件。我看了这个例子：但目前还不清楚如何创建自定义事件组件。我也查看了文档，但没有明确的例子：
谁能举出一个例子，说明有人为react-big-calendar创建了一个自定义组件？更新:这是在月份视图中呈现的日历和一些
浏览 0提问于2016-08-08得票数 9
回答已采纳
1回答
我的网站目前运行一个react-big-calendar Calendar，其数据由我手动管理的graphql /阿波罗管理。我想知道是否有一种方法可以直接在我的网站中包括一个定制的Google日历(我指的是UI )，所以前端部分也将由Google Calendar管理(如果存在这种东西，可以直接在iframe或者Google组件中这样，我将把大部分日历前端/后端逻辑留给谷歌，而不是每次我在react-big-calendar上做更改时都要调用Google。我说自定义，因为我仍然需要编辑一些组件
浏览 2提问于2021-01-20得票数 0
无法在react-big-calendar中添加ISO格式的时间
我正在为我的React项目使用react-big-calendar。对于其他组件，我的格式化时间如下: 18:00。我意识到大日历适用于2019-3-12，但当我尝试添加18:00时，它会将事件视为全天事件。
浏览 1提问于2019-07-21得票数 0
我正在尝试实现react大日历，但是我在添加事件和使用设置状态更新事件时遇到了问题。我在Selectable构造函数中引入了handleselect函数，但当我尝试使用它时，得到以下错误 TypeError:无法读取未定义的属性“”handleSelect“” import React, { useState } from "react";
import "react-big-calendar/lib/
浏览 32提问于2021-07-08得票数 0
2回答
我有一个“事件”列表： { description: "Did something", eventTypeId: 1
浏览 13提问于2019-02-22得票数 2
回答已采纳
这是我的“大日历”组件代码，为什么我的11:30的事件消失了，任何帮助都会很好，我将通过api从backe-end获得事件的详细信息，并且我得到了事件的开始时间，并添加了 import { Calendar, momentLocalizer } from 'react-big-calendar';
import withDragAndDrop fro
浏览 2提问于2020-09-11得票数 0
回答已采纳
2回答
我试图显示事件从api上的反应-大日历，但出于某种原因，事件没有显示在日历上。我可以让这些事件得到安慰，但它们不会出现在日历上。下面是我的Calendar.js组件：import { Calendar, momentLocalizer} from 'react-big-calendar'
import moment from 'mom
浏览 4提问于2020-05-12得票数 1
2回答
更改react大日历中行的样式
、、、、
我需要制作一个包含事件的日历，于是我决定使用react-big-calendar。但是我需要用不同的样式做行。所以每一行都应该在30分钟内完成，但我还需要删除默认边框，并在每四行周围创建新的边框。
浏览 20提问于2020-02-10得票数 0
2回答
在开始编写代码之前，我有一个概念性的问题:我从组件A (主项列表)路由到组件B(创建新项的表单)，然后从组件B返回到组件A。我想用新项更新组件A。一种选择是在注入到这两个组件的服务中订阅一个主题。我知道路由保存了组件的状态，并且在路由回组件A时不会调用ngOnInit事件，因此我不能使用此<e
浏览 27提问于2019-03-24得票数 0
2回答
我们有一个带有Save/Initiated (oncomponentsavepre)事件的eventsystem，其中缩略图图像是从正在保存的多媒体组件创建的。然后，将新的缩略图多媒体组件作为多媒体链接添加到在事件中传递的图像组件的元数据中。但是，在打开多媒体组件后有一个
浏览 9提问于2012-09-03得票数 2
回答已采纳
2回答
我使用react大日历通过拖动创建和更新事件时间。我使用useState来处理事件，事件本身是静态的。问题是，他们根本没有装货。我在控制台中得到以下消息：“警告:失败的道具类型：array类型的无效的array提供给Calendar，预期的object。”import { Calendar, dateFnsLocalizer } from
浏览 5提问于2022-02-23得票数 0
react-big-calander - NPM包 https://github.com/intljusticemission/react-big-calendar/blob/master/examples/demos/selectable.js onSelectEvent={event => alert(event.distance, 'info')} 在本例中，我希望在警报中显示event.distance我试图创
浏览 11提问于2019-06-14得票数 1
回答已采纳
2回答
将新道具合并到状态的正确方法
、、、、
我目前正在使用react-big-calendar开发日历组件。目前我只有使用案例，这是从网站的内置通知系统，将有一个功能，添加一个外部事件作为通知发送到您自己的日历。nextProps.reset()
return {events : {...prevState.events, ...nextProps.events}}
浏览 3提问于2019-05-18得票数 1
1回答
目前，我正在做一个项目，使用事件来更新侦听这些事件的其他组件，并尝试将这些事件转换为Redux操作。例如，当用户登录组件时，监听此事件并调用API来更新其状态，事件是基于组件是否存在而触发的，因此对于Redux，我必须使用componentWillupdate检查道具是否在组件内部发生更改，然后从那里调用
浏览 4提问于2019-04-08得票数 0
我看到react-big-calendar最近添加了可调整大小的事件，我正在尝试让这些事件正常工作。下面是他们的拖放示例的代码：
点击拖放按钮=>查看示例源代码。您可以在render中看到可调整大小的道具和onEventResize函数。但是，我在示例中没有看到任何调整大小的操作，如何让可调整大小的事件工作。我知道这是一个非常新的版本，这可能是这个例子没有更新的原因。谢谢。
浏览 21提问于2018-02-23得票数 2
1回答
在我的一个组件中，我使用来自react-router的<Route>组件来呈现我的一个表单组件。在提交表单并创建事件时，我希望我的父组件(其中包含<Route>组件的组件)重新呈现，以便我的事件列表将包含添加的事件。PrivateEvents events={state.private}/>
<
浏览 0提问于2018-03-02得票数 0
2回答
我正在尝试使用React-big-calendar显示事件。我对时间格式有问题。在将事件传递给日历时，我使用的数据如下： {
end: Tue Nov 03 2020 21:42:16 GMT+0100 (Central European Standard Time)我在波兰语locale中使用date-fns作为本地化。我还将culture prop用于日历组件。这是我的组件- https://github.com/sSwierg
浏览 36提问于2020-11-03得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
