为什么调用本地反应原生模块阻止UI？

发布时间：2020-12-15 05:08:16 所属栏目：百科来源：网络整理

导读：正如文档中所建议的,我将一些长数据获取代码移动到本机模块中以释放JS线程,但我发现这仍然阻止了UI.为什么这样,我该怎么办才能避免这种情况？从JS调用本机模块,如下所示： MyNativeModule.fetch(path).then( data = dispatchData(data) ) 原生方法看起来像

正如文档中所建议的,我将一些长数据获取代码移动到本机模块中以释放JS线程,但我发现这仍然阻止了UI.为什么这样,我该怎么办才能避免这种情况？

从JS调用本机模块,如下所示：

MyNativeModule.fetch(path).then( data => dispatchData(data) )

原生方法看起来像这样(它使用Android Firebase SDK)：

@ReactMethod
public void fetch(final String path,final Promise promise) {
    root.child(path).addListenerForSingleValueEvent(new ValueEventListener() {
        @Override
        public void onDataChange(DataSnapshot snapshot) {
            if (snapshot.exists()) {
                promise.resolve(castSnapshot(snapshot));
            } else {
                promise.resolve(null);
            }
        }
        @Override
        public void onCancelled(FirebaseError firebaseError) {
            promise.reject(firebaseError.getMessage());
        }
    }
}

castSnapshot方法将Firebase DataSnapshot对象转换为WriteableMap.如果有用,我可以分享实现.

我观察到的是即使我替换了promise.resolve(castSnapshot(snapshot)); by castSnapshot(snapshot); promise.resolve(null);,调用阻止了UI：所以它不是通过桥接器发送数据的罪魁祸首.如果数据量很大,castSnapshot可能需要一些时间,这显然是阻塞的.

即使这段代码长时间运行,也不应该将它移动到原生模块中释放UI？我怎么没有得到这个？

非常感谢.

尝试在新的Thread实例中包装root.child行,如下所示：

@ReactMethod
public void fetch(final String path,final Promise promise) {
    new Thread(new Runnable() {
        public void run() {
            root.child(path)...
        }
    }).start();
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!