CODEWITHSUNDEEP
javascriptreactjs
dungreact
dungreact

Reputation: 534

How to create tui-calendar creation pop-up in React

I'm creating Customize Popup for my application using tui-calendar

this is my code:

    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]);

I just need start and end time for my pop-up to create schedule. scheduleData will pass as props to pop-up component.

How can I make createSchedules() method waiting for pop-up return newSchedule to create new schedule? this time console.log(newSchedule); will return null;

Thanks & Best regards

Upvotes: 0

Views: 1001

Answers (1)

Rahsheen
Rahsheen

Reputation: 46

Since you're using hooks, you could just add a separate useEffect on newSchedule that makes the call to createSchedules. And remove the logic from the callback.

This runs every time newSchedule changes regardless of the value so you may need some conditional logic here.

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

Upvotes: 3

Related Questions