The examples for hydration with rum involve just rendering an entire react component to document.body. But I'm having trouble hydrating in just a part of an html page.
Say I want to render a component to a home.html page and then hydrate.
(render-file
"home.html"
{:component-to-render (rum/render-html header)})
Then I include it on the page.
<div id="component-root">
a {{ component-to-render }}
</div>
Unfortunately that will just render a literal string, so I cant hydrate it from there.
I would expect to be able to do this in the clojurescript
(rum/hydrate header (.getElementById js/document "component-root"))
Is there no way to do this kind of partial hydration on a plain html page?I was able to solve this with the safe filter in selmer.
<div id="component-root">
a {{ component-to-render|safe }}
</div>
render-html will give you a string that you can hydrate