无法在Android设备上运行React-Native示例代码

对于javaScript和React-Native的新手来说，尝试创建演示应用程序。该应用程序在Emulator中正常运行。同样的屏幕截图如下： Emulator Screenshot 无法在Android设备上运行React-Native示例代码

虽然如果我尝试在我的设备上运行应用程序，应用程序无法运行。以下是相同的截图：

Device Screenshot

请让我知道如果需要发布的任何代码。我试图寻找上述提到的问题的解决方案，但没有找到任何

以下是JavaScript代码：

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

var React = require('react-native'); 
var { 
    AppRegistry, 
    Image, 
    ListView, 
    StyleSheet, 
    Text, 
    View, 
} = React; 

var API_KEY = '7waqfqbprs7pajbz28mqf6vz'; 
var API_URL = 'http://api.rottentomatoes.com/api/public/v1.0/lists/movies/in_theaters.json'; 
var PAGE_SIZE = 25; 
var PARAMS = '?apikey=' + API_KEY + '&page_limit=' + PAGE_SIZE; 
var REQUEST_URL = API_URL + PARAMS; 




var Button = require('react-native-icon-button'); 
var AwesomeProject = React.createClass({ 
    getInitialState: function() { 
    return { 
     dataSource: new ListView.DataSource({ 
     rowHasChanged: (row1, row2) => row1 !== row2, 
     }), 
     loaded: false, 
    }; 
    }, 

    componentDidMount: function() { 
    this.fetchData(); 
    }, 

    fetchData: function() { 
    fetch(REQUEST_URL) 
     .then((response) => response.json()) 
     .then((responseData) => { 
     this.setState({ 
      dataSource: this.state.dataSource.cloneWithRows(responseData.movies), 
      loaded: true, 
     }); 
     }) 
     .done(); 
    }, 

    render: function() { 
    if (!this.state.loaded) { 
     return this.renderLoadingView(); 
    } 

    return (
    <View style={styles.mainLayout}> 
     <Button 
     style={styles.button} 
     onPress={this._handlePress}> 
     color={"white"} 
     iconSize={20} 
     text={"Press me!"} 
     </Button> 
     <ListView 
     dataSource={this.state.dataSource} 
     renderRow={this.renderMovie} 
     style={styles.listView}/> 
    </View> 

    ); 
    }, 
_handlePress(event){ 
console.log('Pressed'); 
}, 
    renderLoadingView: function() { 
    return (
     <View style={styles.container}> 
     <Text> 
      Loading movies... 
     </Text> 
     </View> 
    ); 
    }, 

    renderMovie: function(movie) { 
    return (
     <View style={styles.container}> 
     <Image 
      source={{uri: movie.posters.thumbnail}} 
      style={styles.thumbnail} 
     /> 
     <View style={styles.rightContainer}> 
      <Text style={styles.title}>{movie.title}</Text> 
      <Text style={styles.year}>{movie.year}</Text> 
     </View> 
     </View> 
    ); 
    }, 
}); 

var styles = StyleSheet.create({ 
    container: { 
    flex: 1, 
    flexDirection: 'row', 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#F5FCFF', 
    }, 
    rightContainer: { 
    flex: 1, 
    }, 
    title: { 
    fontSize: 20, 
    marginBottom: 8, 
    textAlign: 'center', 
    }, 
    year: { 
    textAlign: 'center', 
    }, 
    thumbnail: { 
    width: 53, 
    height: 81, 
    }, 
    listView: { 
    paddingTop: 20, 
    backgroundColor: '#F5FCFF', 
    }, 
    mainLayout:{ 
    flex: 1, 
    flexDirection: 'column', 
    justifyContent: 'center', 
    alignItems: 'center', 
    backgroundColor: '#F5FCFF', 
    }, 
    button: { 
    padding: 10, 
    borderRadius: 5, 
    backgroundColor: '#272822', 
    color: 'white' 
    }, 
}); 

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

请让我知道，如果我犯错误的任何地方。

来源

2015-10-13 Rajesh Bhagat

可能是这个链接将帮助你http://stackoverflow.com/questions/32572399/react-native-android-failed-to-load-js-bundle –

@AliRaza非常感谢。请发布这个答案，以便我可以接受它。 –