//组件渲染完毕时调用此方法
componentDidMount(){
   //get方法，只填写url参数
    fetch('http://192.168.71.150:3000/json/commondity.json')
       //上面一行会返回响应对象，即response
      .then((response)=>response.json())
      //response.json()将返回一个json类型对象
      .then((json)=>{
        this.setState({source:json});
      //注意我们在Promise调用链的最后调用了done() —— 这样可以抛出异常而不是简单忽略。
      }).done();
  }

以上then()方法是promise调用链中的回调方法

在此发现一个坑！

constructor(props){
    super(props);
    this.state={
        source:{},
        single:0,
    };
  }

在上面的fetch回调方法中，我们将从服务端获取的数据以json对象类型放到state中的source变量中，问题就出在这里！如果我们要从source中获取数据，用如下语句this.state.source[0].id来获取id值会报错。（此处json数据为数组）

原因:

   source:{},

由于初始赋值为{},而在setState()之前就用到this.state.source[0].id,此时source不是数组，也没有id这个字段,{}只是undefined

注:setState语句在componentDidMount()时才执行，而this.state.source[0].id在componentWillMount()时就执行

解决方案:

source赋值为初始调用语句的对应结构

接着第二个问题

JSX语法之谜

错误写法

return(
  <View style={styles.container}>
  {    var list = [];
      for (var i in this.state.source){
        var Row = (
          <Text key={i}>{this.state.source[i].title}</Text>
        )
        list.push(Row);
      }
  }
  {list}
</View>
)

以上写法严重错误，{}中应该是属性表达式，更直观的说应该是已经定义好的变量。{}中可以使用条件表达式(？：)

上述第一个{}中的for in部分可以卸载render中，切记不可在return中！！！