@tarojs/plugin-platform-harmony-ets 3.7.0-alpha.27

package/dist/components-harmony-ets/element.ets

@@ -0,0 +1,223 @@
+import {
+  TaroButtonElement as _TaroButtonElement,
+  TaroCheckboxGroupElement as _TaroCheckboxGroupElement,
+  TaroScrollViewElement as _TaroScrollViewElement,
+  TaroElement as _TaroElement,
+  TaroFormWidgetElement as _TaroFormWidgetElement,
+  TaroIgnoreElement as _TaroIgnoreElement,
+  TaroImageElement as _TaroImageElement,
+  TaroInputElement as _TaroInputElement,
+  TaroPickerElement as _TaroPickerElement,
+  TaroRadioGroupElement as _TaroRadioGroupElement,
+  TaroSliderElement as _TaroSliderElement,
+  TaroSwitchElement as _TaroSwitchElement,
+  TaroTextElement as _TaroTextElement,
+  TaroVideoElement as _TaroVideoElement,
+  TaroViewElement as _TaroViewElement,
+  TaroCheckboxElement as _TaroCheckboxElement,
+  TaroRadioElement as _TaroRadioElement,
+  TaroIconElement as _TaroIconElement,
+  TaroLabelElement as _TaroLabelElement,
+  TaroRichTextElement as _TaroRichTextElement,
+  TaroSwiperElement as _TaroSwiperElement,
+  TaroSwiperItemElement as _TaroSwiperItemElement,
+  TaroTextAreaElement as _TaroTextAreaElement,
+  FormElement as _FormElement,
+  Current,
+  TaroAny
+} from '@tarojs/runtime'
+
+import { TaroCheckbox, TaroCheckboxGroup } from './checkbox'
+import { TaroRadio, TaroRadioGroup } from './radio'
+import TaroButton from './button'
+import TaroView from './view'
+import TaroForm from './form'
+import TaroIcon from './icon'
+import TaroText from './text'
+import TaroImage from './image'
+import TaroInput from './input'
+import TaroScrollView from './scrollView'
+import TaroTextArea from './textArea'
+import TaroRichText from './richText'
+import TaroLabel from './label'
+import TaroVideo from './video'
+import TaroPicker from './picker'
+import TaroSwitch from './switch'
+import TaroSlider from './slider'
+import { TaroSwiper } from './swiper'
+
+@Observed
+class TaroElement extends _TaroElement {
+  constructor(tagName: string) {
+    super(tagName)
+  }
+  declare public _instance: TaroAny
+}
+
+@Observed
+class TaroViewElement extends _TaroViewElement {
+  declare public _instance: TaroView
+}
+
+@Observed
+class TaroTextElement extends _TaroTextElement {
+  declare public _instance: TaroText
+}
+
+@Observed
+class TaroImageElement extends _TaroImageElement {
+  declare public _instance: TaroImage
+}
+
+@Observed
+class TaroScrollViewElement extends _TaroScrollViewElement {
+  declare public _instance: TaroScrollView
+}
+
+@Observed
+class TaroButtonElement extends _TaroButtonElement {
+  declare public _instance: TaroButton
+}
+
+@Observed
+class TaroInputElement extends _TaroInputElement {
+  declare public _instance: TaroInput
+}
+
+@Observed
+class TaroSliderElement extends _TaroSliderElement {
+  declare public _instance: TaroSlider
+}
+
+@Observed
+class TaroSwitchElement extends _TaroSwitchElement {
+  declare public _instance: TaroSwitch
+}
+
+@Observed
+class TaroCheckboxGroupElement extends _TaroCheckboxGroupElement {
+  declare public _instance: TaroCheckboxGroup
+}
+
+@Observed
+class TaroRadioGroupElement extends _TaroRadioGroupElement {
+  declare public _instance: TaroRadioGroup
+}
+
+@Observed
+class TaroPickerElement extends _TaroPickerElement {
+  declare public _instance: TaroPicker
+}
+
+@Observed
+class TaroVideoElement extends _TaroVideoElement {
+  declare public _instance: TaroVideo
+}
+
+@Observed
+class TaroCheckboxElement extends _TaroCheckboxElement{
+  declare public _instance: TaroCheckbox
+}
+
+@Observed
+class TaroRadioElement extends _TaroRadioElement{
+  declare public _instance: TaroRadio
+}
+
+@Observed
+class TaroIconElement extends _TaroIconElement{
+  declare public _instance: TaroIcon
+}
+
+@Observed
+class TaroLabelElement extends _TaroLabelElement{
+  declare public _instance: TaroLabel
+}
+
+@Observed
+class TaroRichTextElement extends _TaroRichTextElement{
+  declare public _instance: TaroRichText
+}
+
+@Observed
+class TaroSwiperElement extends _TaroSwiperElement{
+  declare public _instance: TaroSwiper
+}
+
+@Observed
+class TaroSwiperItemElement extends _TaroSwiperItemElement{
+  declare public _instance: TaroSwiper
+}
+
+@Observed
+class TaroTextAreaElement extends _TaroTextAreaElement{
+  declare public _instance: TaroTextArea
+}
+
+@Observed
+class TaroFormElement extends _FormElement {
+  declare public _instance: TaroForm
+}
+
+@Observed
+class TaroFormWidgetElement extends _TaroFormWidgetElement {}
+
+@Observed
+class TaroIgnoreElement extends _TaroIgnoreElement {}
+
+export function initHarmonyElement () {
+  Current.createHarmonyElement = (tagName: string) => {
+    switch (tagName) {
+      case 'view': return new TaroViewElement()
+      case 'image': return new TaroImageElement()
+      case 'text': return new TaroTextElement()
+      case 'button': return new TaroButtonElement()
+      case 'scroll-view': return new TaroScrollViewElement()
+      case 'checkbox-group': return new TaroCheckboxGroupElement()
+      case 'ignore': return new TaroIgnoreElement()
+      case 'input': return new TaroInputElement()
+      case 'picker': return new TaroPickerElement()
+      case 'radio-group': return new TaroRadioGroupElement()
+      case 'slider': return new TaroSliderElement()
+      case 'switch': return new TaroSwitchElement()
+      case 'video': return new TaroVideoElement()
+      case 'checkbox': return new TaroCheckboxElement()
+      case 'radio': return new TaroRadioElement()
+      case 'icon': return new TaroIconElement()
+      case 'label': return new TaroLabelElement()
+      case 'rich-text': return new TaroRichTextElement()
+      case 'swiper': return new TaroSwiperElement()
+      case 'swiper-item': return new TaroSwiperItemElement()
+      case 'text-area': return new TaroTextAreaElement()
+      case 'form': return new TaroFormElement()
+      default: return new TaroElement(tagName)
+    }
+  }
+}
+
+export {
+  TaroButtonElement,
+  TaroCheckboxGroupElement,
+  TaroElement,
+  TaroScrollViewElement,
+  TaroFormWidgetElement,
+  TaroIgnoreElement,
+  TaroImageElement,
+  TaroInputElement,
+  TaroPickerElement,
+  TaroRadioGroupElement,
+  TaroSliderElement,
+  TaroSwitchElement,
+  TaroTextElement,
+  TaroVideoElement,
+  TaroViewElement,
+  TaroCheckboxElement,
+  TaroRadioElement,
+  TaroIconElement,
+  TaroLabelElement,
+  TaroRichTextElement,
+  TaroSwiperElement,
+  TaroSwiperItemElement,
+  TaroTextAreaElement,
+  TaroFormElement
+}

package/dist/components-harmony-ets/form.ets

@@ -0,0 +1,149 @@
+import { bindInstanceToNode, AREA_CHANGE_EVENT_NAME, eventHandler, getComponentEventCallback, VISIBLE_CHANGE_EVENT_NAME, initComponentNodeInfo, findChildNodeWithDFS,
+  TaroEvent,
+  TaroAny,
+  TaroFormWidgetElement
+} from '@tarojs/runtime'
+
+import { createNode } from './render'
+import TaroComponentWrapper from './base'
+import { TOUCH_EVENT_MAP } from './utils/constant/event'
+import { FlexManager } from './utils/FlexManager'
+import { createTaroEvent } from './utils/events'
+import { getNormalAttributes, shouldBindEvent, getNodeThresholds, bindAnimation } from './utils/helper'
+
+import type { TaroFormElement, TaroElement, TaroCheckboxElement, TaroRadioElement, TaroInputElement,
+  TaroSliderElement,
+  TaroSwitchElement,
+  TaroPickerElement
+} from './element'
+import type { TaroStyleType } from '@tarojs/runtime'
+
+
+@Extend(Flex)
+function attrs (style: TaroStyleType) {
+  .id(style.id)
+  .key(style.id)
+  .padding(style.padding)
+  .margin(style.margin)
+  .width(style.width)
+  .height(style.height)
+  .constraintSize(style.constraintSize)
+  .flexGrow(style.flexGrow)
+  .flexShrink(style.flexShrink)
+  .flexBasis(style.flexBasis)
+  .alignSelf(style.alignSelf)
+  .backgroundColor(style.backgroundColor)
+  .backgroundImage(style.backgroundImage, style.backgroundRepeat)
+  .backgroundImageSize(style.backgroundImageSize)
+  .rotate(style.rotate)
+  .scale(style.scale)
+  .translate(style.translate)
+  .transform(style.transform)
+  .borderStyle(style.borderStyle)
+  .borderWidth(style.borderWidth)
+  .borderColor(style.borderColor)
+  .borderRadius(style.borderRadius)
+  .linearGradient(style.linearGradient)
+  .zIndex(style.zIndex)
+  .opacity(style.opacity)
+  .clip(style.clip)
+}
+
+@Component
+export default struct TaroForm {
+  nodeInfoMap: TaroAny = {}
+
+  @Styles visibleChangeEvent () {
+    .onVisibleAreaChange(getNodeThresholds(this.node) || [0.0, 1.0], getComponentEventCallback(this.node, VISIBLE_CHANGE_EVENT_NAME))
+  }
+
+  @ObjectLink node: TaroFormElement
+
+  aboutToAppear () {
+    initComponentNodeInfo(this, this.node)
+    bindInstanceToNode(this.node, this)
+    // 绑定动画
+    bindAnimation(this.node)
+
+    // 监听submit冒泡
+    this.node.addEventListener('submit-btn', (e: TaroEvent) => {
+      e.stopPropagation()
+      const formResult: Record<string, string> = {}
+      findChildNodeWithDFS(this.node, (item: TaroFormWidgetElement) => {
+        switch (item.nodeName) {
+          case 'INPUT':
+          case 'SLIDER':
+          case 'SWITCH':
+          case 'RADIO-GROUP':
+          case 'CHECKBOX-GROUP':
+          case 'PICKER': {
+            formResult[item.name] = item.value
+            break
+          }
+        }
+        return false
+      }, true)
+      const event: TaroEvent = createTaroEvent('submit', { detail: { value: formResult } }, this.node)
+      eventHandler(event, 'submit', this.node)
+    })
+    // 监听reset冒泡
+    this.node.addEventListener('reset-btn', (e: TaroEvent) => {
+      findChildNodeWithDFS(this.node, (item: TaroFormWidgetElement) => {
+        e.stopPropagation()
+        switch (item.nodeName) {
+          case 'INPUT': {
+            item.value = (item as TaroInputElement)._attrs.value
+            break
+          }
+          case 'SLIDER': {
+            item.value = (item as TaroSliderElement)._attrs.value
+            break
+          }
+          case 'SWITCH': {
+            item.value = (item as TaroSwitchElement)._attrs.checked
+            break
+          }
+          case 'RADIO-GROUP': {
+            item.getElementsByTagName<TaroRadioElement>('RADIO').forEach(element => {
+              element._instance.checked = element._attrs.checked || false
+            })
+            break
+          }
+          case 'CHECKBOX-GROUP': {
+            item.getElementsByTagName<TaroCheckboxElement>('CHECKBOX').forEach(element => {
+              element._instance.checked = element._attrs.checked || false
+            })
+            break
+          }
+          case 'PICKER': {
+            item.value = (item as TaroPickerElement)._attrs.value
+            break
+          }
+        }
+        return false
+      }, true)
+    })
+  }
+
+  @Styles defaultEvent () {
+    .onClick(shouldBindEvent((e: ClickEvent) => eventHandler(e, 'click', this.node), this.node, ['click']))
+    .onTouch(shouldBindEvent((e: TouchEvent) => eventHandler(e, TOUCH_EVENT_MAP.get(e.type), this.node), this.node, TOUCH_EVENT_MAP.values()))
+    .onAreaChange(getComponentEventCallback(this.node, AREA_CHANGE_EVENT_NAME, res => {
+      const eventResult: TaroAny = res.eventResult
+      this.nodeInfoMap[this.node._nid].areaInfo = eventResult[1]
+    }))
+  }
+
+  build() {
+    TaroComponentWrapper({ node: this.node }) {
+      Flex(FlexManager.flexOptions(this.node)) {
+        ForEach(this.node.childNodes, (item: TaroElement) => {
+          createNode(item)
+        }, (item: TaroElement) => item._nid)
+      }
+      .attrs(getNormalAttributes(this.node))
+      .defaultEvent()
+      .visibleChangeEvent()
+    }
+  }
+}

package/dist/components-harmony-ets/icon.ets

@@ -0,0 +1,84 @@
+import { bindInstanceToNode, eventHandler, convertNumber2VP, getComponentEventCallback, AREA_CHANGE_EVENT_NAME, VISIBLE_CHANGE_EVENT_NAME, initComponentNodeInfo, TaroAny } from '@tarojs/runtime'
+
+import TaroComponentWrapper from './base'
+import { ICON_SVG_MAP } from './utils/constant/icon'
+import { getNormalAttributes, shouldBindEvent, getNodeThresholds, bindAnimation } from './utils/helper'
+
+import type { TaroIconElement } from './element'
+import type { TaroStyleType } from '@tarojs/runtime'
+
+
+@Extend(Image)
+function attrs (style: TaroStyleType) {
+  .id(style.id)
+  .key(style.id)
+  .padding(style.padding)
+  .margin(style.margin)
+  .width(style.width || convertNumber2VP(23))
+  .height(style.height || convertNumber2VP(23))
+  .constraintSize(style.constraintSize)
+  .flexGrow(style.flexGrow)
+  .flexShrink(style.flexShrink)
+  .flexBasis(style.flexBasis)
+  .alignSelf(style.alignSelf)
+  .backgroundColor(style.backgroundColor)
+  .backgroundImage(style.backgroundImage, style.backgroundRepeat)
+  .backgroundImageSize(style.backgroundImageSize)
+  .rotate(style.rotate)
+  .scale(style.scale)
+  .translate(style.translate)
+  .transform(style.transform)
+  .borderStyle(style.borderStyle)
+  .borderWidth(style.borderWidth)
+  .borderColor(style.borderColor)
+  .borderRadius(style.borderRadius)
+  .linearGradient(style.linearGradient)
+  .zIndex(style.zIndex)
+  .opacity(style.opacity)
+  .clip(style.clip)
+}
+
+@Component
+export default struct TaroIcon {
+  nodeInfoMap: TaroAny = {}
+
+  @Styles visibleChangeEvent () {
+    .onVisibleAreaChange(getNodeThresholds(this.node) || [0.0, 1.0], getComponentEventCallback(this.node, VISIBLE_CHANGE_EVENT_NAME))
+  }
+
+  @ObjectLink node: TaroIconElement
+
+  aboutToAppear () {
+    initComponentNodeInfo(this, this.node)
+    bindInstanceToNode(this.node, this)
+    // 绑定动画
+    bindAnimation(this.node)
+  }
+
+  @Styles defaultEvent () {
+    .onClick(shouldBindEvent((e: ClickEvent) => eventHandler(e, 'click', this.node), this.node, ['click']))
+    .onAreaChange(getComponentEventCallback(this.node, AREA_CHANGE_EVENT_NAME, res => {
+      const eventResult: TaroAny = res.eventResult
+      this.nodeInfoMap[this.node._nid].areaInfo = eventResult[1]
+    }))
+  }
+
+  getIconData () {
+    if (!this.node || !this.node._attrs) return null
+    const type: string = this.node._attrs.type
+    // TODO：等待鸿蒙支持 base64 格式的 svg 图片，或者工程化支持图片资源的迁移
+    return ICON_SVG_MAP.get(type) || null
+  }
+
+  build() {
+    TaroComponentWrapper({ node: this.node }) {
+      Image(this.getIconData())
+        .defaultEvent()
+        .objectFit(ImageFit.Contain)
+        .fillColor(this.node._attrs.color)
+        .onComplete(e => eventHandler(e, 'complete', this.node))
+        .attrs(getNormalAttributes(this.node))
+        .visibleChangeEvent()
+    }
+  }
+}

package/dist/components-harmony-ets/image.ets

@@ -0,0 +1,85 @@
+import { bindInstanceToNode, eventHandler, getComponentEventCallback, AREA_CHANGE_EVENT_NAME, VISIBLE_CHANGE_EVENT_NAME, initComponentNodeInfo, TaroAny } from '@tarojs/runtime'
+
+import TaroComponentWrapper from './base'
+import { getNormalAttributes, shouldBindEvent, getNodeThresholds, bindAnimation } from './utils/helper'
+
+import type { TaroImageElement } from './element'
+import type { TaroStyleType } from '@tarojs/runtime'
+
+@Extend(Image)
+function attrs (style: TaroStyleType) {
+  .id(style.id)
+  .key(style.id)
+  .padding(style.padding)
+  .margin(style.margin)
+  .width(style.width)
+  .height(style.height)
+  .constraintSize(style.constraintSize)
+  .flexGrow(style.flexGrow)
+  .flexShrink(style.flexShrink)
+  .flexBasis(style.flexBasis)
+  .alignSelf(style.alignSelf)
+  .backgroundColor(style.backgroundColor)
+  .backgroundImage(style.backgroundImage, style.backgroundRepeat)
+  .backgroundImageSize(style.backgroundImageSize)
+  .rotate(style.rotate)
+  .scale(style.scale)
+  .translate(style.translate)
+  .transform(style.transform)
+  .borderStyle(style.borderStyle)
+  .borderWidth(style.borderWidth)
+  .borderColor(style.borderColor)
+  .borderRadius(style.borderRadius)
+  .linearGradient(style.linearGradient)
+  .zIndex(style.zIndex)
+  .opacity(style.opacity)
+  .clip(style.clip)
+}
+
+function getImageMode (mode: string): ImageFit {
+  switch (mode) {
+    case 'aspectFit': return ImageFit.Contain
+    case 'aspectFill': return ImageFit.Cover
+    case 'scaleToFill': return ImageFit.Fill
+    case 'widthFix': return ImageFit.Auto
+    case 'heightFix': return ImageFit.Auto
+    default: return ImageFit.Contain
+  }
+}
+
+@Component
+export default struct TaroImage {
+  nodeInfoMap: TaroAny = {}
+
+  @Styles visibleChangeEvent () {
+    .onVisibleAreaChange(getNodeThresholds(this.node) || [0.0, 1.0], getComponentEventCallback(this.node, VISIBLE_CHANGE_EVENT_NAME))
+  }
+
+  @ObjectLink node: TaroImageElement
+
+  aboutToAppear () {
+    initComponentNodeInfo(this, this.node)
+    bindInstanceToNode(this.node, this)
+    // 绑定动画
+    bindAnimation(this.node)
+  }
+
+  @Styles defaultEvent () {
+    .onClick(shouldBindEvent((e: ClickEvent) => eventHandler(e, 'click', this.node), this.node, ['click']))
+    .onAreaChange(getComponentEventCallback(this.node, AREA_CHANGE_EVENT_NAME, res => {
+      const eventResult: TaroAny = res.eventResult
+      this.nodeInfoMap[this.node._nid].areaInfo = eventResult[1]
+    }))
+  }
+
+  build() {
+    TaroComponentWrapper({ node: this.node }) {
+      Image(this.node.getAttribute('src'))
+      .defaultEvent()
+      .objectFit(getImageMode(this.node.getAttribute('mode')))
+      .attrs(getNormalAttributes(this.node))
+      .onComplete(e => eventHandler(e, 'complete', this.node))
+      .visibleChangeEvent()
+    }
+  }
+}

package/dist/components-harmony-ets/index.ts

@@ -0,0 +1,49 @@
+export const TaroViewTagName = 'view'
+export const TaroIconTagName = 'icon'
+export const TaroProgressTagName = 'progress'
+export const TaroRichTextTagName = 'rich-text'
+export const TaroTextTagName = 'text'
+export const TaroButtonTagName = 'button'
+export const TaroCheckboxTagName = 'checkbox'
+export const TaroCheckboxGroupTagName = 'checkbox-group'
+export const TaroFormTagName = 'form'
+export const TaroInputTagName = 'input'
+export const TaroLabelTagName = 'label'
+export const TaroPickerTagName = 'picker'
+export const TaroPickerViewTagName = 'picker-view'
+export const TaroPickerViewColumnTagName = 'picker-view-column'
+export const TaroRadioTagName = 'radio'
+export const TaroRadioGroupTagName = 'radio-group'
+export const TaroSliderTagName = 'slider'
+export const TaroSwitchTagName = 'switch'
+export const TaroCoverImageTagName = 'cover-image'
+export const TaroTextareaTagName = 'textarea'
+export const TaroCoverViewTagName = 'cover-view'
+export const TaroMovableAreaTagName = 'movable-area'
+export const TaroMovableViewTagName = 'movable-view'
+export const TaroScrollViewTagName = 'scroll-view'
+export const TaroSwiperTagName = 'swiper'
+export const TaroSwiperItemTagName = 'swiper-item'
+export const TaroNavigatorTagName = 'navigator'
+export const TaroAudioTagName = 'audio'
+export const TaroCameraTagName = 'camera'
+export const TaroImageTagName = 'image'
+export const TaroLivePlayerTagName = 'live-player'
+export const TaroVideoTagName = 'video'
+export const TaroCanvasTagName = 'canvas'
+export const TaroAdTagName = 'ad'
+export const TaroWebViewTagName = 'web-view'
+export const TaroBlockTagName = 'block'
+export const TaroMapTagName = 'map'
+export const TaroSlotTagName = 'slot'
+export const TaroNativeSlotTagName = 'native-slot'
+export const TaroCustomWrapperTagName = 'custom-wrapper'
+
+export const TaroSpanTagName = 'span'
+export const TaroTabsTagName = 'tabs'
+export const TaroTabBarTagName = 'tab-bar'
+export const TaroTabContentTagName = 'tab-content'
+export const TaroListTagName = 'list'
+export const TaroListItemTagName = 'list-item'
+export const TaroOpenDataTagName = 'open-data'
+export const TaroIgnoreTagName = 'ignore'

package/dist/components-harmony-ets/innerHtml.ets

@@ -0,0 +1,79 @@
+import TaroComponentWrapper from './base'
+import web_webview from '@ohos.web.webview'
+import htmlParser from './utils/htmlParser'
+import { createNode } from './render'
+import type { TaroElement } from './element'
+
+@Component
+export default struct TaroInnerHtml {
+  @ObjectLink node: TaroElement
+
+  // controller: web_webview.WebviewController = new web_webview.WebviewController();
+
+  // isLoaded: boolean = false
+
+  // @State isInit: boolean = false
+
+  // @State height: string = '2vp'  // 如果起始高度不足，将不会渲染webview
+
+  // jsBridge = {
+  //   // 获取父级高度，拿到实际的webview宽度，计算出高度
+  //   load: (bodyHeight: number, bodyWidth: number) => {
+  //     const { width } = this.node.parentElement.instance.info
+  //     const widthPx = vp2px(width)
+  //     this.height = Math.floor(widthPx / bodyWidth * bodyHeight) + 'px'
+  //     this.isInit = true
+  //   }
+  // }
+
+  build() {
+    TaroComponentWrapper({ node: this.node }) {
+      if (this.node.innerHTML) {
+        createNode(htmlParser(this.node.innerHTML))
+      }
+      // // webview实现
+      // if (this.node.innerHTML) {
+      //   Web({ src: $rawfile('innerHTML.html'), controller: this.controller }).onPageBegin((event) => {
+      //     if (this.isLoaded) return
+      //     this.isLoaded = true
+      //     // 注入jsBridge，监听页面onload行为，获取高度
+      //     this.controller.registerJavaScriptProxy(this.jsBridge, 'jsBridge', ['load'])
+      //     const innerString = this.node.innerHTML
+      //     try {
+      //       this.controller.loadData(
+      //         `
+      //           <html>
+      //             <body onload="jsBridge.load(document.getElementById('container').clientHeight, document.body.clientWidth);" style="padding: 0;margin: 0">
+      //               <div id="container">
+      //                 ${innerString}
+      //               </div>
+      //             </body>
+      //           </html>
+      //         `,
+      //         "text/html",
+      //         "UTF-8"
+      //       )
+      //     } catch (error) {
+      //       console.log(`ErrorCode: ${error.code},  Message: ${error.message}`);
+      //     }
+      //   })
+      //     .javaScriptAccess(true)
+      //     .size({
+      //       width: '100%',
+      //       height: this.height
+      //     })
+      //     .visibility(this.isInit)
+      //   // 覆盖webwiew的scroll
+      //   Stack({ alignContent: Alignment.TopStart }) {
+      //     Flex().size({
+      //       height: this.height,
+      //       width: '100%'
+      //     })
+      //   }.position({
+      //     x: 0,
+      //     y: 0
+      //   })
+      // }
+    }
+  }
+}