When push new groups & items, errors appears about react-calendar-timeline HOT 5 CLOSED

Same here, it has to do with re-rendering. If you try to zoom in you will now be able to stop getting that error and everything runs normal again. Looking for a workaround

from react-calendar-timeline.

@janckk so i should reduce re-rending counts?

from react-calendar-timeline.

Haven't found a solution yet. But if I zoom in and out the rerendering happens. Because if I push the new prop to the timeline I don't see immediate result. For example: I push another item and I only see it displayed after zoom in/out or when I drag other already existing items. If you add a new item you see it immediately rendered?

from react-calendar-timeline.

Hey, the timeline expects your items and groups arrays, and actually all other props as well, to be immutable. That means if you change something in items, you must pass it a new array with new items. Just adding something into the existing array will not work.

The sortedDimensionItems array is only updated when this condition is met:

nextProps.items !== this.props.items || nextProps.groups !== this.props.groups

That means, don't mutate your items array, pass in a new items array.

from react-calendar-timeline.

For some example code, I assume this is what you currently do:

var items = []
<Timeline items={items} />

items.push({id: 1})
items.push({id: 2})
items.push({id: 3})

But this is what you should be doing:

var items = []
<Timeline items={items} />

items = items.concat([{id: 1}])
items = items.concat([{id: 2}])
items = items.concat([{id: 3}])

This makes the timeline aware that the items array changed. Otherwise it's not smart (nor fast) enough to check every element inside items for changes.

from react-calendar-timeline.