中国优质的IT技术网站
专业IT技术创作平台
IT职业在线教育平台
本文原创发布在华为开发者社区。
本示例实现了简单的JSBridge,使H5和原生两侧可以互相调用对方的方法。
构建JSBridge源码链接
打开应用后,点击调用native按钮,实现原生方面调用H5方法,在后台打印数据。
invokeHandle(handleName: string, callbackName: string) { try { this.webviewController.runJavaScript(`jsBridge.registerHandle('${handleName}', '${callbackName}')`) .then(res => { if (res) { console.log('原生调h5成功:' + res) } else { console.log('原生调h5失败') } }) .catch((err: BusinessError) => { console.log('原生调h5失败:' + err.message) }) } catch (e) { console.log((e as BusinessError).message) } }
callHandle(handleName: string, data: object, callback?: (payload: object) => void): void { switch (handleName) { case 'userInfo': this.userInfo(data, callback) break case 'h5Callback': this.h5Callback(data, callback) break default: break } }
微信扫码分享