Last active
July 29, 2018 19:22
-
-
Save haltcase/2f65d19903c45f11049ac8a4bf1b5e7b to your computer and use it in GitHub Desktop.
karax re-render attempt
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Page</title> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
</head> | |
<body id="body"> | |
<div id="ROOT" /> | |
<script type="text/javascript" src="nimcache/t.js"></script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import karax/[vdom, karax, karaxdsl] | |
import future | |
type | |
Label = ref object | |
id: int | |
flag: bool | |
var labels: seq[Label] = @[] | |
for i in 0..9: labels.add Label(id: i, flag: (i mod 2 == 0).bool) | |
proc onClickToggle (e: Event, n: VNode, label: Label, i: int) = | |
echo i | |
labels[i].flag = not label.flag | |
proc render (): VNode = | |
result = buildHtml(tdiv): | |
h4: | |
text "unflagged:" | |
for i, label in labels: | |
if not label.flag: continue | |
button(`type` = "button", onClick = (e: Event, n: VNode) => onClickToggle(e, n, label, i)): | |
text "toggle " & $label.id | |
h4: | |
text "flagged:" | |
for i, label in labels: | |
if label.flag: continue | |
button(`type` = "button", onClick = (e: Event, n: VNode) => onClickToggle(e, n, label, i)): | |
text "toggle " & $label.id | |
setRenderer render |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment