js:adjust hook timing for nested situation

doric-android/doric/src/main/java/pub/doric/shader/slider/NestedSliderNode.java

@@ -73,7 +73,7 @@ public class NestedSliderNode extends GroupNode<ViewPager> implements ViewPager.
             @NotNull
             @Override
             public Object instantiateItem(@NotNull ViewGroup container, int position) {
-                container.addView(slideItems.get(position), 0);
+                container.addView(slideItems.get(position));
                 return slideItems.get(position);
             }
         });

doric-demo/src/StickDemo.ts

@@ -77,7 +77,7 @@ class StickDemo extends Panel {
                                 return new FlowLayoutItem().apply({
                                     backgroundColor: colors[itemIdx % colors.length],
                                     height: 50,
-                                    layoutConfig: layoutConfig().configWidth(LayoutSpec.JUST),
+                                    layoutConfig: layoutConfig().configWidth(LayoutSpec.MOST),
                                 }).also(it => {
                                     it.addChild(text({
                                         text: `In Page ${idx},${itemIdx}`,

doric-js/bundle/doric-lib.js

@@ -736,9 +736,29 @@ class Panel {
         this.context.shader.render(model);
     }
     hookBeforeNativeCall() {
+        if (Environment.platform !== 'h5') {
+            this.__root__.clean();
+            for (let v of this.headviews.values()) {
+                v.clean();
+            }
+        }
     }
     hookAfterNativeCall() {
+        if (Environment.platform !== 'h5') {
             //Here insert a native call to ensure the promise is resolved done.
+            nativeEmpty();
+            if (this.__root__.isDirty()) {
+                const model = this.__root__.toModel();
+                this.nativeRender(model);
+            }
+            for (let v of this.headviews.values()) {
+                if (v.isDirty()) {
+                    const model = v.toModel();
+                    this.nativeRender(model);
+                }
+            }
+        }
+        else {
             Promise.resolve().then(() => {
                 if (this.__root__.isDirty()) {
                     const model = this.__root__.toModel();
@@ -755,6 +775,7 @@ class Panel {
             });
         }
     }
+}
 __decorate$2([
     NativeCall,
     __metadata$2("design:type", Function),

doric-js/bundle/doric-vm.js

@@ -2184,9 +2184,29 @@ class Panel {
         this.context.shader.render(model);
     }
     hookBeforeNativeCall() {
+        if (Environment.platform !== 'h5') {
+            this.__root__.clean();
+            for (let v of this.headviews.values()) {
+                v.clean();
+            }
+        }
     }
     hookAfterNativeCall() {
+        if (Environment.platform !== 'h5') {
             //Here insert a native call to ensure the promise is resolved done.
+            nativeEmpty();
+            if (this.__root__.isDirty()) {
+                const model = this.__root__.toModel();
+                this.nativeRender(model);
+            }
+            for (let v of this.headviews.values()) {
+                if (v.isDirty()) {
+                    const model = v.toModel();
+                    this.nativeRender(model);
+                }
+            }
+        }
+        else {
             Promise.resolve().then(() => {
                 if (this.__root__.isDirty()) {
                     const model = this.__root__.toModel();
@@ -2203,6 +2223,7 @@ class Panel {
             });
         }
     }
+}
 __decorate$2([
     NativeCall,
     __metadata$2("design:type", Function),

doric-js/src/ui/panel.ts

@@ -13,7 +13,6 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
-import '../runtime/global'
 import { View, Group } from "./view"
 import { loge } from '../util/log'
 import { Model } from '../util/types'
@@ -31,6 +30,8 @@ export function NativeCall(target: Panel, propertyKey: string, descriptor: Prope
 
 type Frame = { width: number, height: number }
 
+declare function nativeEmpty(): void
+
 export abstract class Panel {
     context!: BridgeContext
     onCreate() { }
@@ -141,10 +142,29 @@ export abstract class Panel {
     }
 
     private hookBeforeNativeCall() {
+        if (Environment.platform !== 'h5') {
+            this.__root__.clean()
+            for (let v of this.headviews.values()) {
+                v.clean()
+            }
+        }
     }
 
     private hookAfterNativeCall() {
+        if (Environment.platform !== 'h5') {
             //Here insert a native call to ensure the promise is resolved done.
+            nativeEmpty()
+            if (this.__root__.isDirty()) {
+                const model = this.__root__.toModel()
+                this.nativeRender(model)
+            }
+            for (let v of this.headviews.values()) {
+                if (v.isDirty()) {
+                    const model = v.toModel()
+                    this.nativeRender(model)
+                }
+            }
+        } else {
             Promise.resolve().then(() => {
                 if (this.__root__.isDirty()) {
                     const model = this.__root__.toModel()
@@ -160,5 +180,5 @@ export abstract class Panel {
                 }
             })
         }
-
+    }
 }