根据WebView React Native中正在查看的当前页面注入不同的Javascript

时间:2018-10-08 02:25:33

标签: javascript react-native

背景

我构建了一个IOS应用程序,该应用程序使用WebView加载网站并通过单击带有Javascript的按钮来浏览用户浏览4页。我现在正在将该应用程序转换为React Native,并且在第二页加载时,似乎没有触发Javascript。我以为这是因为丢失了,但是我不确定React Native是否继续在每次加载页面时或仅在加载的第一页上注入javascript,而在客户端重新加载或更改后可能会丢失该页面。

示例

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="nav">
   <ul>
      <li id="projects">
         Projects
         <ul>
            <a href="/one" class="blocklink">
               <li id="one">One</li>
            </a>
         </ul>
      </li>
   </ul>
</div>

问题

请告诉我将特定的Javascript注入WebView的正确方法,具体取决于WebView当前正在浏览哪个页面?

在上面的示例中,我显示了2个步骤。步骤1成功,但是当WebView加载第二页时,Javascript的第二步不成功。

1 个答案:

答案 0 :(得分:0)

将您的注入脚本更改为

 <WebView
    ignoreSslError={true}
    source={{ uri: "https://www.example.com" }}
    style={{ marginTop: 20, height: 400, width: 400 }}
    injectedJavaScript={injectedJavaScript}
    javaScriptEnabledAndroid={true}
    onError={() => this.webviewError(e)}
    startInLoadingState={true}
    scalesPageToFit={true}
    onLoad={this.updateInjectedJavaScript}
  />

,以便在重新加载页面时执行。