更新3-26-2019
我正在尝试使用户能够向日历添加事件,并使这些事件在输入时出现。我正在使用React.js前端,并且可以获取要在新日历中渲染的事件,但不会删除旧日历(我只是在每个日历顶部渲染了 10 + 个日历)其他)。
我尝试过使用.destroy()
方法,然后重新渲染日历,但是该方法似乎不可用/无法正常工作,因此我想尝试rerenderEvents()
并保留相同的日历对象,但该功能似乎也无法访问。愿意与熟悉 FullCalendar v.4
一旦用户将收集到的数据输入到数据对象中并将其追加到状态中,但是如果我只是镜像上面的内容,它将在旧日历的顶部呈现一个全新的日历。
就像我无法获得渲染后的Calendar对象以进行这些方法调用一样,但是在将其捕获到单独的函数时遇到了麻烦。文档只说是叫.destroy()
还是叫.rerenderEvents()
,而不是叫他们什么。
//This successfully Renders
componentOnMount() {
var calendarNew = document.getElementById('calendar');
let newCalendar = new Calendar(calendarNew, {
plugins: [ dayGridPlugin, timeGridPlugin, listPlugin ],
events: this.state.events
});
console.log(newCalendar)
await this.setState({ calendarObj: newCalendar })
// let myNewEvents = newCalendar.getEvents()
// console.log(myNewEvents)
// let stateEvents = this.state.calendarObj.getEvents()
// console.log(stateEvents)
this.state.calendarObj.render();
}
我已经尝试了以下方法来缓解双重渲染...
async handleNewEvent() {
// code that creates an object and sets the state to the new event array//
var newEventArr = existingEvents.concat(newEvent)
console.log(newEventArr)
await this.setState({ events: newEventArr })
await this.setState({ currentIndex: (this.state.currentIndex + 1) })
this.props.change(this.state.events, this.state.currentIndex)
//Contains the new event array in the console
console.log(this.state.events)
this.state.calendarObj.rerenderEvents();
}
但是这什么也没做。我什至无法从handleNewEvent()中渲染(),就好像状态无法在其中保留函数,而且我也找不到找到将函数从ComponentDidMount()传递到handleNewEvent()的方法。我不知所措...