search

lucasferreira / react-native-webview-android

Simple React Native Android module to use Android's WebView inside your app
355 stars 158 forks source link

js call app #80

Closed HancleLee closed 6 years ago

HancleLee commented 6 years ago

now js can call app;

Usage: <!DOCTYPE html>

Carson

<WebViewAndroid javaScriptEnabled={true} domStorageEnabled={true} scalesPageToFit={true} startInLoadingState={true} geolocationEnabled={false} builtInZoomControls={false} decelerationRate="normal" automaticallyAdjustContentInsets={false} url={url} style={styles.base} jsToApp={this._jsToApp.bind(this)} />

_jsToApp(params) { // alert("_jsToApp"); }

KingBarbarian commented 6 years ago

请教：该pr是否实现了原rn webview onmessage方法？

HancleLee commented 6 years ago

@KingBarbarian 没有哦，原rn webivew里js调用app时用window.postMessage，我这里是注入了app对象，调用方法是app.jsToApp；但原理应该是一样的

KingBarbarian commented 6 years ago

@HancleLee 那我把你的合到我的包中了哦，谢谢哈，方便加个联系方式，使用过程中有问题咨询下您呗

KingBarbarian commented 6 years ago

@HancleLee 我是react的web端，请问如何调用rn中的方法呢～？ 这个是rn端 jsToApp={this.jsToApp.bind(this)} <WebViewAndroid ref={"webview"} jsToApp={this.jsToApp.bind(this)} style={{ flex: 1, justifyContent: "center", alignItems: "center", height: height - 64 }} onNavigationStateChange={this.onNavigationStateChange.bind(this)} onMessage={this.invoke.listener} source={{ uri: "http://192.168.31.185:8090" }} javaScriptEnabled={true} domStorageEnabled={true} /> 那么react web端呢？app对象如何得来

HancleLee commented 6 years ago

@KingBarbarian app对象是app端通过js注入的，web端直接调用就行了

KingBarbarian commented 6 years ago

但是如果web端直接使用 app.jsToApp("js call app,hello,app!!!"); 就会出现以下错误

Uncaught TypeError: app.jsToApp is not a function
    at App.toNext (index.js?97d3:42)
    at onClick (index.js?97d3:82)
    at ListItem._this2.onClick (ListItem.js?40b9:120)
    at onClick (ListItem.js?40b9:172)
    at Object.ReactErrorUtils.invokeGuardedCallback (ReactErrorUtils.js?8875:69)
    at executeDispatch (EventPluginUtils.js?5685:85)
    at Object.executeDispatchesInOrder (EventPluginUtils.js?5685:108)
    at executeDispatchesAndRelease (EventPluginHub.js?3c44:43)
    at executeDispatchesAndReleaseTopLevel (EventPluginHub.js?3c44:54)
    at Array.forEach (<anonymous>)
HancleLee commented 6 years ago

@KingBarbarian 试试window.app.jsToApp("js call app,hello,app!!!");

KingBarbarian commented 6 years ago

@HancleLee 不行，还是报错的

HancleLee commented 6 years ago

@KingBarbarian orz 直接用try catch吧

HancleLee commented 6 years ago

@KingBarbarian 我上传了一份到我的github上 https://github.com/HancleLee/react-native-webview-android，在dev分支有demo， 你可以看看，也可以直接用我放在npm上的版本（ npm install react-native-webview-android-hancle --save）

lucasferreira commented 6 years ago

Hi guys, whats going on here? I understand only english :(

HancleLee commented 6 years ago

@lucasferreira Sorry,We should not discuss the problem here.