如何在 React Native 中使用 FlatList 和 webView 顯示數據？

Question

我已經創建了 flatList 並且我正在傳遞對象數組。 每個對象都有標題和數據數組。 在 FlatList 的 renderItem 中，我試圖顯示標題文本，但它給出的錯誤為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 和 FlatList 顯示 HTML 內容？

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 個解決方案

解決方案1
1 已采納 2018-10-24 15:33:08

如何在 React Native 中使用 FlatList 和 webView 顯示數據？

問題描述

1 個解決方案

解決方案1 1 已采納 2018-10-24 15:33:08

解決方案1
1 已采納 2018-10-24 15:33:08