React Native＆Expo - SVGがiOSデバイスでレンダリングされない

Question

'create-react-native-app'を使用してプロジェクトを開始しましたが、.svgファイルのレンダリング方法がわかりません。私はすべてのようなsvgのためのライブラリreact-native-svg-uri、react-native-svg-image、msvgc（react-native-svgとコンポーネントを反応させるための.svg）を試しています。 私のアプリでアプリプレビュー（expo付き）を実行すると、瞬時にクラッシュし、実際の.svg画像を表示するのではなく、アニメーションの読み込みのみを表示することがあります。 エラーはありません。単純にsvgをレンダリングしません。

たとえば、このコードは、ローディングアニメーション

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> 

を示しては、事前にありがとうございます！

Answer 1

これは、iOS上でテストされていないreact-native-svg-imageライブラリに問題があるようです。 iOSのWebViewでhtml小道具を使用すると、startInLoadingState={true}を設定できません。そうでない場合は、ローディングインジケータが消えません。これは反応のネイティブで長い間存在していた動作です。詳細についてはissue 542を参照してください - それは確かに理想的ではありませんが、うまくいけば誰かがこれを読んで修正します！

showWebviewLoader小物をfalseに設定すると、この問題を回避できます。

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