反應本機 <Image> 在Android中無法使用

Question

• 以下代碼可在iOS上完美運行。
• 實際上，以下代碼是從iOS上逐字復制的。
• 我通過進行其他更改並將其加載到應用程序中來確保react-native將更改正確地加載到應用程序中。
• 盡管如此，位於http://i.imgur.com/UePbdph.jpg的圖像根本無法在Android中顯示。
• 更新 ：我嘗試了“檢查元素”，並且可以在屏幕上看到圖像，但是它是一個空白框。

我這樣運行服務器

react-native start > /dev/null 2>&1 &

然后我每次更改代碼時都運行這些

curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"
react-native run-android

源代碼：

/**
 * Sample React Native App
 * https://github.com/facebook/react-native
 */
'use strict';

var React = require('react-native');
var {
  AppRegistry,
  Image,
  StyleSheet,
  Text,
  View,
} = React;
var MOCKED_MOVIES_DATA = [
  {title: 'Title', year: '2015', posters: {thumbnail: 'http://i.imgur.com/UePbdph.jpg'}},
];

var AwesomeProject = React.createClass({
  render: function() {
    var movie = MOCKED_MOVIES_DATA[0];
    return (
      <View style={styles.container}>
        <Text>{movie.title}</Text>
        <Text>{movie.year}</Text>
        <Image
          source={{uri: movie.posters.thumbnail}}
          style={styles.thumbnail}
        />
      </View>
    );
  }
});

var styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
  },
  thumbnail: {
    width: 53,
    height: 81,
  },
});

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

Answer 1

我一定會檢查您的index.android.js文件，並確保您正確包含所有組件依賴項，這是唯一可以防止同一代碼在跨平台組件（如Image）上作用不同的唯一方法。