javascript - react 原生 getElementById

Question

想做一个

document.getElementById('js-pjax-loader-bar')

来自 https://github.com/facebook/react-native

我不知道怎么得到它!

我尝试:

const jsCode = "document.getElementById('js-pjax-loader-bar')";
return (     
  <WebView
    source={{uri: 'https://github.com/facebook/react-native'}}
    onMessage={this._onMessage}
    injectedJavaScript={jsCode }
    style={{marginTop: 20}}
  />
);

可能脚本运行​​了，但我不知道如何得到结果。

Answer 1

我认为您需要将 javaScriptEnabled 属性设置为 true 并使用 setTimeout 等待 DOM 加载。

const jsCode = "setTimeout(function() {document.getElementById('js-pjax-loader-bar');}, 2000)";

和 WebView

<WebView
    javaScriptEnabled={true}  
    source={{uri: 'https://github.com/facebook/react-native'}}
    onMessage={this._onMessage}
    injectedJavaScript={jsCode }
    style={{marginTop: 20}}
/>

也可以在jsCode里面加一个alert来测试。

要接收 _onMessage 函数，您需要使用 window.postMessage

const jsCode = "setTimeout(function(){window.postMessage(JSON.stringify(document.getElementById('js-pjax-loader-bar')),'https://github.com/facebook/react-native');}, 2000)";

而且 _onMessage 必须是这样的

_onMessage(data) {
    var element = JSON.parse(data.nativeEvent.data);
}