1.flutter 与前端JS 交互

有时候学的东西太多容易忘记。
核心代码

1.flutter 端

 WebView(
        initialUrl: webUrl,
        javascriptMode: JavascriptMode.unrestricted,
        javascriptChannels: <JavascriptChannel>{
          _toasterJavascriptChannel(context),
        },
 _toasterJavascriptChannel(BuildContext context) {
    return JavascriptChannel(
        name: 'Toast', //注册一个名字为Toast的全局js方法
        onMessageReceived: (JavascriptMessage message) {
          //处理业务的代码逻辑
          if (kDebugMode) {
            print("html5按钮点我返回的${message.message}");
          }
        });
  }		

2,js端代码

document.getElementById("flutterTest").addEventListener("click",()=>{
			console.log('调用了吗')
			Toast.postMessage(
			  JSON.stringify({
			      name: 'tom',
			      age: 12
			  })
		);
})
Logo

北京人形旗下天工造物具身智能开源社区,聚焦具身天工与慧思开物两大平台

更多推荐