使用 React Native Webview 添加本地 HTML 和 JS 文件

Question

我想加载一个本地HTML文件，该文件使用react-native-webview中的标签导入本地javascript库。
我尝试了很多解决方案，但没有一个在 React Native 上起作用0.60.5。

• 我已经尝试过这种方法，但我在 iOS 上收到 Domain Not Found -1100 错误。
• 尝试了这个解决方案，但它不起作用。（导入js文件的说明也不清楚）

我在用 ：

"react": "16.8.6",
"react-native": "0.60.5"

PS：我正在尝试在 webView 中实现highcharts.js图表库。

Answer 1

<View
        style={{
         flex:1
        }}
        >
          <WebView 
        scalesPageToFit
          originWhitelist={["*"]} 
          source={{ uri:"file:///android_asset/highcharts/index.htm",baseUrl:"file:///android_asset/highcharts/"

         }}/>

        </View>

这是 highchart 中的一个工作示例react-native-webview。

1. 1.首先将所有html/js代码移动到以下目录： your_project/android/app/src/main/assets/. 如果该assets文件夹尚不存在，请创建它。
2. 现在将所有代码粘贴到您创建的文件夹html/css/js中assets
3. 关闭您的终端/cmd/bash 或任何用于运行react-native run-android命令的内容。
4. 现在运行以下命令。react-native run-android。

5. 现在将上述代码粘贴到您的.js文件中。设置uri为您的 html 文件的路径，例如uri:"file:///android_asset/YOUR_HTML_FILE"您的baseUrl:"file:///android_asset/YOUR_MAIN_FOLDER/"