Question

我刚刚开始学习React Native，我正在关注official tutorial，我的模拟器和手机（Android）中都没有显示图像，只是空白屏幕。所以我的问题，为什么它没有显示在屏幕上？ P.S：互联网连接正常。

import React, { Component } from 'react';
import { AppRegistry, Image } from 'react-native';

    class Bananas extends Component {
      render() {
        let pic = {
          uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'
        };
        return (
          <Image source={pic} style={{width: 193, height: 110}}/>
        );
      }
    }

    AppRegistry.registerComponent('Bananas', () => Bananas);

Answer 1

您正确地执行了Image部分，我相信您只需将其包装在视图中。

import React, { Component } from 'react';
import { AppRegistry, Image, View } from 'react-native';

class Bananas extends Component {
  render() {
    let pic = {
      uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg'
    };
    return (
      <View style={{flex: 1}}> 
        <Image source={pic} style={{width: 193, height: 110}}/>
      </View>
    );
  }
}

AppRegistry.registerComponent('Bananas', () => Bananas);

图片不显示在本机中（Android）

1 个答案: