如何在 react-native 中把二进制数据显示为图像？

Question

我是一个非常新的反应，我有一个用例，比如，在API响应中获取书籍的细节与图像。我需要迭代的响应，我需要显示的图像。

作为建议 二进制数据显示为图像 以下是我使用的代码。但图像不显示。任何建议将被感激。我做错了什么？

<View>
                <FlatList data={books} renderItem={
                    data => {
                        console.log("data is -? " + books.author);
                        //const buffer = Buffer.from(data.item.image.data, 'binary').toString('base64');
                       /* let image = btoa(
                            new Uint8Array(data.item.image.data)
                                .reduce((d, byte) => d + String.fromCharCode(byte), '')
                        );*/

                        const encoded = data.item.image.data;
                        <View style={styles.imageContainer}>
                            <Image
                                source={{
                                   uri: `data:image/jpeg;base64,${encoded}`
                                } }
                                //source="{URL.createObjectUrl(encoded)}"
                                style={styles.stretch}
                            />
                        </View>
                    }
                } />
                </View>

Answer 1

这里分享的解决方案如何解决这个问题，希望这可能会帮助别人。只是分享工作代码。

<FlatList data={books} keyExtractor={(item, index) => item.id.title+index} 
renderItem={({ item }) =>
         <Item title={item} />
     } />


function Item({ title }) {
  let ed = 'data:image/png;base64,' + title.image.data;
 return (
<View>
                        <Image source={{ uri: ed }} /></View>
);
}