如何在没有react-native-static-server或类似的情况下在React Native WebView中显示本地html？

Question

在React Native项目中，我在src目录中有html文档。 （假设它名为“./src/green.html”）。

在 MyScreen 中，我有一个用于显示此页面的 WebView。

import WebView from 'react-native-webview';
import { Text, View, StyleSheet, Image } from 'react-native';

export default MyScreen (props) {
    const source = require('./green.html');
    const webviewSOurce = Image.resolveAssetSource(source);

    return (
        <View style>
            <WebView
                source={webSource}
                originWhitelist={["*"]}
                style={{
                    width:'100%',
                    minHeight:400
            }}/>
        </View>
    )

}

但是它以纯文本形式显示 html 文件的内容，而不是 html。

    
    <div id="main-div">
    <h1>Hello World! I am alive!</h1>
    </div>

我访问了https://github.com/react-native-webview/react-native-webview/blob/master/docs/Guide.md#loading-local-html-files，但我无法获取清晰的图像和react-native-http-server会导致我的应用程序出现一些问题。

我该如何处理？有没有其他方法可以在没有react-native-static-server或react-native-http-server的情况下在WebView中显示本地html页面？

Answer 1

你应该做

source={{html:webSource}}