fix add child to group,not make root dirty

js-framework/demo.ts

@@ -1,4 +1,5 @@
 import { Gravity, Mutable, NativeCall, Text, Color, VLayout, Panel, log, logw, loge, Group, Stack, } from "./index"
+import { WRAP_CONTENT } from "./src/ui/view";
 
 
 @Entry
@@ -7,14 +8,16 @@ export class MyPage extends Panel {
     build(rootView: Group): void {
         const state = Mutable.of(1)
         const numberView = new Text
-        numberView.width = 100
-        numberView.height = 200
+        numberView.width = WRAP_CONTENT
+        numberView.height = WRAP_CONTENT
         numberView.top = 50
         state.bind((v) => {
             numberView.text = v.toString()
         })
         numberView.textSize = 40
-        numberView.centerX = rootView.width / 2
+        numberView.layoutConfig = {
+            alignment: new Gravity().centerX()
+        }
         rootView.addChild(numberView)
         const click = new Text
         click.textSize = 20
@@ -22,7 +25,7 @@ export class MyPage extends Panel {
         click.onClick = () => {
             state.set(state.get() + 1)
         }
-        click.top = numberView.bottom + 20
+        click.top = 200
 
         click.layoutConfig = {
             alignment: new Gravity().centerX()
@@ -33,24 +36,17 @@ export class MyPage extends Panel {
         const vlayout = new VLayout
         vlayout.width = this.getRootView().width
         vlayout.height = 500
-
+        vlayout.bgColor = Color.parse('#ff00ff')
         vlayout.top = 50
         vlayout.centerX = this.getRootView().width / 2
         vlayout.space = 0
         vlayout.gravity = (new Gravity()).bottom()
-        const v = [1, 2, 3,].map(e => {
+        vlayout.onClick = () => {
             const stack = new Stack
             stack.width = stack.height = 50
             stack.bgColor = Color.safeParse('#00ff00')
             vlayout.addChild(stack)
-            stack.onClick = () => {
-                loge('stack:onClick')
-                if (vlayout.space !== undefined) {
-                    loge('change space')
-                    vlayout.space += 10
-                }
-            }
-        })
+        }
         rootView.addChild(vlayout)
     }
 

js-framework/src/ui/view.ts

@@ -140,7 +140,7 @@ export abstract class View implements Modeling {
         }
         this.__dirty_props__[propKey] = newV
         if (this.parent instanceof Group) {
-            this.parent.onChildPropertyChanged(this, propKey, oldV, newV)
+            this.parent.onChildPropertyChanged(this)
         }
     }
 
@@ -220,6 +220,10 @@ export abstract class Group extends View {
                 const childrenModel = this.getDirtyChildrenModel()
                 childrenModel[parseInt(index)] = value.nativeViewModel
             }
+            if (this.parent) {
+                this.parent.onChildPropertyChanged(this)
+            }
+
             return Reflect.set(target, index, value)
         }
     })
@@ -246,9 +250,13 @@ export abstract class Group extends View {
         return super.toModel()
     }
 
-    onChildPropertyChanged(child: View, propKey: string, oldV: Model, newV: Model) {
+    onChildPropertyChanged(child: View) {
         this.getDirtyChildrenModel()[this.children.indexOf(child)] = child.nativeViewModel
     }
+
+    isDirty() {
+        return super.isDirty()
+    }
 }
 
 export class Stack extends Group {