react-native：未设置宽度或高度时不显示图像

Question

版本：0.38

只需使用 flex 指定图像样式，没有宽度和高度，但图像不会显示在移动屏幕上。这该怎么做。

<View style={styles.container}>
    <Image style={styles.image} source={{uri : 'https://www.baidu.com/img/bd_logo1.png'}}>
    </Image>
</View>



const styles = StyleSheet.create({
  container: {
    flex: 1
  },
  image: {
     flex: 1,
    resizeMode: 'contain'
  },
});

Answer 1

网络图片要求您设置高度/宽度样式道具。

反应本机文档。

您将在应用程序中显示的许多图像在编译时将不可用，或者您需要动态加载一些图像以保持二进制大小。与静态资源不同，您需要手动指定图像的尺寸。

// GOOD
<Image source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}}
       style={{width: 400, height: 400}} />

// BAD
<Image source={{uri: 'https://facebook.github.io/react/img/logo_og.png'}} />