geoff
/
um
mirror of https://github.com/n2geoff/um
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

todo example as test

This commit is contained in:
Geoff Doty 2024-05-05 15:05:08 -04:00
parent 21f4c4344d
commit c91c015ffd
1 changed files with 30 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
test/index.html
View File

@ -7,26 +7,41 @@
<title>Tagged UI Creation Lib</title> <title>Tagged UI Creation Lib</title>
</head> </head>
<body> <body>
<div id="app"> <div id="app"></div>
Tagged Loading...
</div>
<script type="module"> <script type="module">
import {app, h} from "../src/index.js"; import {app, h} from "../src/index.js";
const myapp = app({ const $ = document.querySelector.bind(document);
state: {name: "[Your Name Here]", job: "Developer"},
view(state, actions) { const todo = app({
state: {todos: ["one", "two", "three"], value: ""},
actions: {
add: (state, event) => {
return {...state, todos: [...state.todos, $("#todo").value]};
}
},
view: (state, actions) => {
return h("main", [ return h("main", [
h("strong", `Greeting from ${state.name}`), h("h1", "Todo App"),
h("div", `Your local ${state.job}`), h("hr"),
h("div", {id: "test"}, [ h("div", [
h("h1", "Hello Tagged"), h("label", "Todo"),
h("p", 21), h("input", {id: "todo", value: state.value}),
h("hr") h("button", {onclick: actions.add}, "Add")
]) ]),
h("hr"),
h("ul", state.todos.map((i) => {
return h("li", {}, i)
})
),
h("hr"),
h("strong", `Count: ${state.todos.length}`),
h("hr"),
]); ]);
} },
}, "#app"); mount: "#app"
});
</script> </script>
</body> </body>
</html> </html>