react-native - 在 native react 中显示 Base64 svg

Question

我目前正在尝试在 flatlist 中显示标志。但是标志不显示在屏幕上。代码如下。我能做些什么来解决这个问题

<View style={styles.container}>
   <StatusBar backgroundColor="grey" barStyle="light-content"/>
   <Image source={{uri:"data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iNDAwIiB2aWV3Qm94PSIwIDAgMyAyIj4NCjxwYXRoIGZpbGw9IiMwMDk1NDMiIGQ9Im0wLDBoM3YyaC0zeiIvPg0KPHBhdGggZmlsbD0iI2ZiZGU0YSIgZD0ibTAsMmwyLTJoMXYyeiIvPg0KPHBhdGggZmlsbD0iI2RjMjQxZiIgZD0ibTMsMHYyaC0yeiIvPg0KPC9zdmc+DQo="}} style={{width:100,height:100}}/>
 </View>

Answer 1

使用 atob() 解码 base 64 字符串.
安装在 npm 包下面。

import { SvgXml } from 'react-native-svg';

const DATA_IMAGE = atob('some base 64 string')


<View style={ProfileStyles.footer}>
   <SvgXml xml={DATA_IMAGE} width='50%' height='50%' /> </View>