cerxes/csx
3
1
Fork 0
Code Issues Pull Requests Releases Wiki Activity

A working version but using non-legacy decorators should be reconsidered, and probably quite a few bugs left in the render loop

Browse Source
This commit is contained in:
Miel Truyen
2019-11-03 15:35:19 +01:00
parent fc527cb156
commit 3a135a30d1
18 changed files with 599 additions and 257 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
test/todos-mvc/components/todo-item.jsx
View File

@@ -1,9 +1,11 @@
import {defineElement, render, CustomElement, Host, ShadowDOM} from "../../../packages/csx-custom-elements";
import {defineElement, render, CustomElement, Host, ShadowDOM, State} from "../../../packages/csx-custom-elements";
import style from './todo-item.scss';
@defineElement('todo-item')
export class TodoItem extends CustomElement{
checked = false;// TODO annotate as prop (attribute)
@State() checked = false;// TODO annotate as prop instead of state (attribute)
@State() model; // TODO annotate as prop instead of state
@State() text;
render(){
return (
@@ -27,12 +29,13 @@ export class TodoItem extends CustomElement{
handleChange = ()=>{
this.dispatchEvent(new CustomEvent('check', {
detail: (this.checked=!this.checked),
detail: {checked: (this.checked=!this.checked), id: this.model},
bubbles: true
}));
};
handleClick = ()=>{
this.dispatchEvent(new CustomEvent('remove', {
detail: {id: this.model},
bubbles: true
}));
};