图像未在React教程中加载

时间:2017-07-24 00:38:09

标签: javascript reactjs react-native

有谁知道为什么图片可能无法加载? index.ios.js在下面,其余代码只是从

生成

react-native init TestApp

我不确定开关标签是错还是什么。当我把它放入浏览器时,图像似乎加载。 enter image description here

    import React, { Component } from 'react';
var MOCKED_MOVIES_DATA = [
  {title: 'Title', year: '2015', posters: {thumbnail: 'http://i.imgur.com/UePbdph.jpg'}},
];

import {
  AppRegistry,
  Image,
  StyleSheet,
  Text,
  View
} from 'react-native';

export default class TestApp extends Component {
  render() {
    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('TestApp', () => TestApp);

2 个答案:

答案 0 :(得分:3)

添加到 Info.plist

<select name="date">
<option value="<?php echo $date_end;?>">1 Month</option>

答案 1 :(得分:2)

问题在于您尝试从http连接加载图像,而不是按照Apple推荐的https连接加载图像。

您可以通过编辑info.plist来修复它,如Kawatare267所述

您可以在此处查看更多详情

希望这有帮助。

Can't show Image by URI in React Native iOS Simulator