karaxnim / karax

Karax. Single page applications for Nim.
MIT License
1.05k stars 90 forks source link

How to attach and detach a custom a `Node` to the karax dom? #266

Closed hamidb80 closed 10 months ago

hamidb80 commented 10 months ago

Hey,

I have some Nodes that are created by another library.

and I cant just use it's innerHTML becuase its stateful (has sub Nodes that have registered events )

Any ideas?

example code that I want it to work

import std/dom
include karax/prelude

var cachedPosts: Table[int, Node]

func PostComponent(id: int): VNode = 
  buildHTML:
    if id in cachedPosts:
       cachedPosts[id]
    else:
      text "Loading ..."
hamidb80 commented 10 months ago

this seems to work:

import std/dom
include karax/prelude

var n = document.createElement("span")
n.innerHTML = "WOWOW"

proc wrapper: VNode = 
    result = buildHtml verbatim ""
    result.dom = n

var c = 0

proc createDom(): VNode =
  result = buildHtml tdiv:
    wrapper()
    button():
        text $c
        n.innerHTML = n.innerHTML & "wow"
        proc onclick = 
            c.inc

setRenderer createDom