Hi

# kvision

[Robert Jaros]

Hi

[Norbi]

Thanks.
One thing I don't get is how the virtual DOM tree gets in sync with the real DOM tree after the latter is modified by JQuery - even not just the given component's local DOM tree but globally?

[Robert Jaros]

I doesn't. It doesn't have to be in sync.

[Robert Jaros]

Of course it would be ideal if the vdom and real dom were always in sync.

[Robert Jaros]

But it's not always the case. If you know React it's a bit similar how controlled and uncontrolled inputs work.

[Robert Jaros]

So vdom renders a DOM element and after that other things can happen. E.g. jQuery plugin can transfrom this simple element into a complex component.

[Robert Jaros]

We just need to hook into the lifecycle of the original element. When it is being removed by the vdom, we remove the component (e.g. with some destroy() method provided by the plugin). When it's inserted again - we recreate the component.

[Robert Jaros]

Look here at afterInsert and afterDestroy methods:
https://github.com/rjaros/kvision/blob/master/kvision-modules/kvision-bootstrap-datetime/src/main/kotlin/pl/treksoft/kvision/form/time/DateTimeInput.kt#L259

[Robert Jaros]

It could probably depend on the vdom implementation, but with snabbdom it works quite well.

[Norbi]

Thanks for the quick info!