如何在 React 中创建 tui-calendar 创建弹出窗口

Question

我正在使用tui-calendar为我的应用程序创建自定义弹出窗口

这是我的代码：

    const onBeforeCreateSchedule = useCallback(data => {
        setScheduleData({
            start: data.start.toDate(),
            end: data.end.toDate(),
        });
        setCreateScheduleModalVisible(true);
        console.log(newSchedule);
 props.calendarRef.current.calendarInst.createSchedules([newSchedule]);
    }, [newSchedule, props.calendarRef]);

我只需要我的弹出窗口的开始和结束时间来创建时间表。 scheduleData将作为道具传递给弹出组件。

如何使createSchedules()方法等待弹出返回newSchedule以创建新计划？ 这次console.log(newSchedule); 将返回 null；

谢谢和最好的问候

Answer 1

由于您使用的是钩子，因此您可以在useEffect newSchedule调用createSchedules 。 并从回调中删除逻辑。

无论值如何，每次newSchedule更改时都会运行，因此您可能需要一些条件逻辑。

useEffect(() => {
  props.calendarRef.current.calendarInst.createSchedules([newSchedule]);
}, [newSchedule])