HarmonyOS 鸿蒙Next记录利用bind(this)解决报错SourceMap is not initialized yet

【结论】

将 emptyLayout: () => EmptyBuilder(),
修改为 emptyLayout: EmptyBuilder.bind(this),<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>

【起因】

在使用第三方上拉下拉刷新组件时，调用全局封装的空布局组件会报错。

第三方：https://ohpm.openharmony.cn/#/cn/detail/@abner%2Frefresh

报错信息

Error message:Cannot read property observeComponentCreation2 of undefined
Stacktrace:
SourceMap is not initialized yet
at EmptyBuilder (entry|entry|1.0.0|src/main/ets/view/CommonBuilder.ts:2:5)
at emptyLayout (entry|entry|1.0.0|src/main/ets/pages/Page66.ts:63:44)
at anonymous (entry|@abner/refresh|1.3.4|src/main/ets/RefreshLayout.js:1035:21)
at ifElseBranchUpdateFunction (/usr1/hmos_for_system/src/increment/sourcecode/foundation/arkui/ace_engine/frameworks/bridge/declarative_frontend/engine/stateMgmt.js:4137:4137)
at anonymous (entry|@abner/refresh|1.3.4|src/main/ets/RefreshLayout.js:1034:17)
at updateFunc (/usr1/hmos_for_system/src/increment/sourcecode/foundation/arkui/ace_engine/frameworks/bridge/declarative_frontend/engine/stateMgmt.js:6661:6661)<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>

【示例代码】

src/main/ets/view/CommonBuilder.ets

@Builder
export function EmptyBuilder() {
Stack() {
Text(‘空布局测试’)
}
}<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>

src/main/ets/pages/Page66.ets

import { ListView, RefreshController } from ‘@abner/refresh’
import { EmptyBuilder } from ‘…/view/CommonBuilder’

@Entry
@Component
struct Page65 {
array: string[] = [‘1’, ‘2’]
controller: RefreshController = new RefreshController() //刷新控制器，声明全局变量
build() {
Column() {
  ListView({
    items: <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.array, <span class="hljs-comment"><span class="hljs-comment">//数据源 数组,任意类型</span></span>
    itemLayout: (item, index) =&gt; <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.itemLayout(item, index),
    controller: <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.controller, <span class="hljs-comment"><span class="hljs-comment">//控制器，负责关闭下拉和上拉</span></span>
    isLazyData: <span class="hljs-literal"><span class="hljs-literal">false</span></span>, <span class="hljs-comment"><span class="hljs-comment">//禁止懒加载，也就是使用ForEach进行数据加载</span></span>
    onRefresh: () =&gt; {
      <span class="hljs-comment"><span class="hljs-comment">//下拉刷新</span></span>
      <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.controller.finishRefresh();
    },
    onLoadMore: () =&gt; {
      <span class="hljs-comment"><span class="hljs-comment">//上拉加载</span></span>
      <span class="hljs-keyword"><span class="hljs-keyword">this</span></span>.controller.finishLoadMore();
    },
    emptyLayout: EmptyBuilder.bind(<span class="hljs-keyword"><span class="hljs-keyword">this</span></span>),<span class="hljs-comment"><span class="hljs-comment">//这样写() =&gt; EmptyBuilder() 如果在当前struct中没问题，但放到全局里就不行了。</span></span>
    showEmptyLayout: <span class="hljs-literal"><span class="hljs-literal">true</span></span>
  })

}
.height(<span class="hljs-string"><span class="hljs-string">'100%'</span></span>)
.width(<span class="hljs-string"><span class="hljs-string">'100%'</span></span>)
.justifyContent(FlexAlign.Center)
}
/**

Author:AbnerMing
Describe:条目布局
@param item  数据对象
@param index  数据索引
*/
@Builder
itemLayout(item: Object, index: number): void {
//条目视图，任意组件
Column() {
Text(item:${item},index:${index})
}
}
}<button style="position: absolute; padding: 4px 8px 0px; cursor: pointer; top: 8px; right: 8px; font-size: 14px;">复制</button>