本机自动生成的代码能执行,但用网上的代码就不行



  • 实际说明:
    我本机的index.ios.js代码如下

    /**

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

    class AwesomeProject extends Component {
    render() {
    let MOCKED_MOVIES_DATA = [
    {title: 'Title', year: '2015', posters: {thumbnail: 'http://e.jikexueyuan.com/headerandfooter/images/logo.png'}},
    ];
    let movie = MOCKED_MOVIES_DATA[0];
    let mo='http://e.jikexueyuan.com/headerandfooter/images/logo.png';
    let REQUEST_URL = 'https://raw.githubusercontent.com/facebook/react-native/master/docs/MoviesExample.json';
    return (
    <View style={styles.container}>
    <Image
    source={{uri:movie.posters.thumbnail}}
    style={styles.thumbnail}
    />
    <Text style={styles.welcome}>
    世界你好-Hello World!{movie.year}
    </Text>
    </View>
    );
    }
    }

    const styles = StyleSheet.create({
    container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
    },
    welcome: {
    fontSize: 20,
    textAlign: 'center',
    margin: 10,
    },
    instructions: {
    textAlign: 'center',
    color: '#333333',
    marginBottom: 5,
    },
    thumbnail: {
    width: 113,
    height: 41,
    },
    });

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

    但网上例子为以下

    /**

    var React = require('react-native');

    var {
    AppRegistry,
    StyleSheet,
    Text,
    View,
    Image,
    ListView,
    } = React;

    var AppRegistry = React.AppRegistry;
    var request_url = "https://raw.githubusercontent.com/facebook/react-native/master/docs/MoviesExample.json";
    var HelloWorld = React.createClass({
    getInitialState: function() {
    return {
    dataSource: new ListView.DataSource({
    rowHasChanged: (row1, row2) => row1 !== row2
    }),
    loaded: false
    }
    },
    componentDidMount: function() {
    // fetch Data
    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.renderList();
    } else {
    return this.renderLoadingView();
    }
    },
    renderList: function() {
    return (
    <ListView
    dataSource={this.state.dataSource}
    renderRow={this.renderItem}
    />
    )
    },
    renderItem: function(movie) {
    // var mockData = {title: 'Title', year: '2015', posters: {thumbnail: 'http://i.imgur.com/UePbdph.jpg'}};
    return (
    <View style={styles.container}>
    <Image source={{uri: movie.posters.thumbnail}} style={styles.thumbnail}/>
    <View style={styles.rightContainer}>
    <Text>{movie.title}</Text>
    <Text>{movie.year}</Text>
    </View>
    </View>
    );
    },
    renderLoadingView: function() {
    return (
    <View style={styles.container}>
    <Text>Loading ,please wait!</Text>
    </View>
    )
    }
    });

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

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

    问,我如何用试例代码,问一下这两个代码的区别是什么?


  • administrators

    例子代码太老了,很多改动没有跟上



  • 老大,说说本质问题


  • administrators

    比如第一行就错了
    从0.25版本开始 react和react-native必须分开引用


登录后回复