Question

我已经创建了flatList，并且正在传递对象数组。每个对象都有标题和数据数组。在FlatList的renderItem中，我尝试显示标题为text的文本，但它显示为null的错误。如何使用flatList显示数据，即我想显示每个对象数组中的标题和数据键。

示例数据：

代码：

<FlatList
                    data={specificationsData}
                    showsVerticalScrollIndicator={false}
                    renderItem={({item}) =>
                    <View style={styles.flatview}>
                        <Text style={styles.name}>{item.title}</Text>                     
                        <WebView originWhitelist={['*']}
                        source={{ html: item.data }}/>  <--- gives error
                    </View>
                    }
                    />

我想显示每个对象和标题中的html数据，因此它将item.title正确显示为文本，但是如果我在WebView中传递item.data，则item.data无法正常工作如何使用webView显示HTML内容和FlatList吗？

Answer 1

建议您尝试使用https://github.com/archriss/react-native-render-html库而不是webView来显示HTML内容。

也许是这样的：

...
import HTML from 'react-native-render-html';
...
<FlatList
    data={specificationsData}
    showsVerticalScrollIndicator={false}
    renderItem={({item}) =>
    <View style={styles.flatview}>
        <Text style={styles.name}>{item.title}</Text>                             
        <HTML html={item.data} />
    </View>
    }
/>

如何在React Native中使用FlatList和webView显示数据？

1 个答案: