如何将参数从react-native-webview传递给javascript?

时间:2019-08-21 13:14:38

标签: javascript react-native react-native-webview

尝试将参数从react-native-WebView发送到javascript函数。

尝试了注入的js无效

应该能够将参数从Webview传递到javascript函数。

1 个答案:

答案 0 :(得分:0)

您可以在Webview中使用injectedJavaScript

这是React-Native-WebView的道具。

用法

const message = "webview"
let jsCode = `jsfunc(message);`;
<WebView
          source={{ uri: "www.example.com" }}
          style={{ flex: 1 }}
          ref={webview => {this.myWebview = webview;}} 
          injectedJavaScript={jsCode}
          javaScriptEnabled={true}
        />

如果要将数据发送到主页,则可以使用后消息。

用法

 // receive message from homepage
 onMessage( event ) {
        console.log( event.nativeEvent.data );
    }

    // send message
    sendPostMessage() {
        console.log( "Sending post message" );
        this.myWebview.postMessage( "Post message" );
    }
...
   <TouchableHighlight onPress={() => this.sendPostMessage()}>
                    <Text>Send post message</Text>
                </TouchableHighlight>
                <WebView
                    style={{flex: 1}}
                    source={{ uri:"www.example.com" }}
                    ref={( webView ) => this.myWebview = webView}
                    onMessage={this.onMessage}
                />