1

我已经使用“create-react-native-app”启动了一个项目,但我不知道如何渲染 .svg 文件。我尝试了所有svg 库,例如 react-native-svg-uri、react-native-svg-image、msvgc(将 .svg 转换为使用 react-native-svg 反应组件),但这些都没有帮助。有时,当我在手机上运行应用程序预览(带有 expo)时,它会立即崩溃,有时它只显示加载动画 - 而不是显示实际的 .svg 图像。没有错误 - 它根本不会呈现 svgs。

例如,此代码显示加载动画

import SVGImage from 'react-native-svg-image';

<View style={styles.slide1}>

       <SVGImage
        style={{ width: 80, height: 80 }}
        source={{uri:'https://fluent-panda.appspot.com.storage.googleapis.com/dumbbell.svg'}}
        />

       <Text style={styles.text}>Hello</Text>
 </View>

先感谢您!

4

1 回答 1

3

这似乎是未在 iOS 上测试的 react-native-svg-image 库的问题。在 iOS 上使用htmlprop 时WebView,不能设置startInLoadingState={true},否则加载指示永远不会消失。这是一种在 react-native 中已经存在很长时间的行为,有关更多信息,请参阅问题 542 ——尽管它肯定不理想,希望有人阅读并修复它!

您可以通过在组件上设置showWebviewLoaderprop 来解决此问题。false

    <SVGImage
      showWebviewLoader={false}
      style={{ width: 80, height: 80 }}
      source={{uri:'https://fluent-panda.appspot.com.storage.googleapis.com/dumbbell.svg'}}
    />
于 2017-05-05T20:02:35.243 回答