广州linux

当前位置:   网站首页 >> react native

react native Setting onMessage on a WebView overrides existing values of window.postMessage

广州大公司(秒杀bat)招react native 有兴趣简历发送到work@68xg.com

公司升级rn版本 需要使用到获取网页高度的功能 ,用到了onmessage这个方法 ,具体不详说太多 直接贴error和代码

Setting onMessage on a WebView overrides existing values of window.postMessage, 
but a previous value was defined.


import React, { Component } from 'react';
import {
    AppRegistry,
    StyleSheet,
    Text,
    WebView,
    ScrollView,
    View
} from 'react-native';
let thisWebView=null;
export default class testrn extends Component {
  constructor(e){
      super(e);
  }
    handleNavigationChange(){
      let a= new Date().getTime();
        const script = 'window.postMessage("'+a+'")';  // eslint-disable-line quotes
        thisWebView &&    thisWebView.injectJavaScript(script);
       // alert("df")
    }
    _onMessage (e) {
        alert(e.nativeEvent.data);
    }
    render() {
        const patchPostMessageFunction = function() {
            var originalPostMessage = window.postMessage;
            var patchedPostMessage = function(message, targetOrigin, transfer) {
                originalPostMessage(message, targetOrigin, transfer);
            };
            patchedPostMessage.toString = function() {
                return String(Object.hasOwnProperty).replace('hasOwnProperty', 'postMessage');
            };
            window.postMessage = patchedPostMessage;
        };
        const patchPostMessageJsCode = '(' + String(patchPostMessageFunction) + ')();';
        return (
              <ScrollView style={{flex:1}}>
                  <View   style={{  height: 2232,}}>
                      <WebView
                          ref={webview => { thisWebView = webview; }}
                          injectedJavaScript={patchPostMessageJsCode}
                          source={{uri: "http://68xg.com?"}}
                          onLoadEnd={this.handleNavigationChange}
                          onMessage={this._onMessage}
                      />
                  </View>
                  <Text>文字文字</Text>
              </ScrollView>
        );
    }
}


发表我的评论

Hi,您需要填写昵称和邮箱!

  • 必填项