update demo

src/Counter.ts

@@ -3,9 +3,7 @@ import { text, vlayout, Image, ViewHolder, VMPanel, ViewModel, Gravity, NativeCa
 interface CountModel {
     count: number
 }
-
+class CounterView extends ViewHolder {
-class CounterView extends ViewHolder<CountModel> {
-
     number!: Text
     counter!: Text
     build(root: Group) {
@@ -76,24 +74,19 @@ class CounterView extends ViewHolder<CountModel> {
             }
         }))
     }
-
-    bind(state: CountModel) {
-        this.number.text = `${state.count}`
-    }
-
-    setCounter(v: Function) {
-        this.counter.onClick = v
-    }
 }
 
 class CounterVM extends ViewModel<CountModel, CounterView> {
-    onAttached(s: CountModel, vh: CounterView): void {
+    onAttached(s: CountModel, vh: CounterView) {
         vh.counter.onClick = () => {
             this.updateState(state => {
                 state.count++
             })
         }
     }
+    onBind(s: CountModel, vh: CounterView) {
+        vh.number.text = `${s.count}`
+    }
 }
 
 @Entry

src/Snake.ts

@@ -134,7 +134,7 @@ class SnakeModel {
     }
 }
 
-class SnakeView extends ViewHolder<SnakeModel> {
+class SnakeView extends ViewHolder {
 
     panel!: Stack
     start?: Text
@@ -346,14 +346,16 @@ class SnakeVM extends ViewModel<SnakeModel, SnakeView>{
         this.updateState(it => it.direction = Direction.down)
     }
 
-    onAttached(state: SnakeModel, v: SnakeView): void {
+    onAttached(state: SnakeModel, v: SnakeView) {
         takeNonNull(v.start)(it => it.onClick = this.start)
         takeNonNull(v.left)(it => it.onClick = this.left)
         takeNonNull(v.right)(it => it.onClick = this.right)
         takeNonNull(v.up)(it => it.onClick = this.up)
         takeNonNull(v.down)(it => it.onClick = this.down)
     }
-
+    onBind(state: SnakeModel, v: SnakeView) {
+        v.bind(state)
+    }
 }
 @Entry
 class SnakePanel extends VMPanel<SnakeModel, SnakeView>{