vis-timeline icon indicating copy to clipboard operation
vis-timeline copied to clipboard

Group id in groupTemplate element

Open archekb opened this issue 3 years ago • 0 comments

Hi all!

I have interesting side effect when use groupTemplate option and try render React component in template. After rendet in vis-inner div have group.id and rendered template.

Example of template:

groupTemplate: (group, element) => {
    if (!group) return;
    ReactDOM.unmountComponentAtNode(element);
    return ReactDOM.render(<Agent users={props.users} agent={group.id} />, element);
},

And no matter what component is render, if we replace <Agent/> to <div></div> nothing not changed.

It looks like: screenshot

I try reproduce this in codepen.io and have no this side effect. I don't know why. =(

Env: "react": "^16.13.1", "react-bootstrap": "^1.0.1", "react-dom": "^16.12.0", "vis-data": "^7.1.2", "vis-timeline": "^7.4.9"

This side effect actual for npm package vis and vis-timeline.

Solution

groupTemplate: (group, element) => {
    if (!group) return;
    ReactDOM.unmountComponentAtNode(element);
    ReactDOM.render(<Agent users={props.users} agent={group.id} />, element);
    return "";
},

Return from template function empty string (not null) and group.id is go away.

archekb avatar Aug 20 '21 13:08 archekb