首页 > 解决方案 > 脱机时不显示 React-Native Webview html 文件

问题描述

我正在使用 React-Native 创建一个应用程序。我正在使用 Webview 以在应用程序中显示本地 html 文件。当手机有互联网连接时,这非常有效,但否则什么都不会显示。是否可以让 Webview 在没有 Internet 连接的情况下显示本地 HTML 文件?

网页浏览代码:

      网络视图
        source={{ uri: 'file:///android_asset/test.html' }}
      />

标签: androidhtmlreact-nativewebviewoffline

解决方案


尝试 -

const debugSource = require('../assets/test.html'); // required for bundling
const releaseSourcePrefix = Platform.OS === 'android' ? 'file:///android_asset' : './assets';
const releaseSource = { uri: `${releaseSourcePrefix}/assets/index.html` };
const webViewSource = Image.resolveAssetSource(global.__DEV__ ? debugSource : releaseSource);
<WebView
scalesPageToFit={false}
source={webViewSource}
originWhitelist={["*"]}
style={{ flex: 1, }}
/>

确保首先在 HTML 中打印文本,以确保 HTML 文件中没有问题。它将帮助您更快地调试


推荐阅读