Bild wird nicht in React geladen Lernprogramm

Question

Weiß jemand, warum das Bild möglicherweise nicht geladen wird? index.ios.js ist unten, Rest des Codes einfach aus

react-native init TestApp

erzeugt wird, ich bin nicht sicher, ob die Öffnungs- und Schließ Tags sind falsch oder was. Das Bild scheint zu laden, wenn ich es in meinen Browser einlege.

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); 

Answer 1

hinzufügen Info.plist

<key>NSAppTransportSecurity</key> 
 
<dict> 
 
    <key>NSAllowsArbitraryLoads</key> 
 
    <true/> 
 
</dict>

Answer 2

das Problem zu Ihrem ist, dass Sie das Bild von einer HTTP-Verbindung und nicht von einer HTTPS-Verbindung zu laden versuchen, wie von Apple empfohlen.

Sie können das Problem beheben, indem info.plist Bearbeitung wie von Kawatare267 beantwortet

Sie können weitere Details sehen hier

Hoffnung, das hilft.

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