//組件渲染完畢時(shí)調(diào)用此方法
componentDidMount(){
//get方法影暴，只填寫url參數(shù)
fetch('http://192.168.71.150:3000/json/commondity.json')
//上面一行會(huì)返回響應(yīng)對象舞痰，即response
.then((response)=>response.json())
//response.json()將返回一個(gè)json類型對象
.then((json)=>{
this.setState({source:json});
//注意我們在Promise調(diào)用鏈的最后調(diào)用了done() —— 這樣可以拋出異常而不是簡單忽略邀窃。
}).done();
}
以上then()方法是promise調(diào)用鏈中的回調(diào)方法
在此發(fā)現(xiàn)一個(gè)坑犬第！
constructor(props){
super(props);
this.state={
source:{},
single:0,
};
}
在上面的fetch回調(diào)方法中锦积，我們將從服務(wù)端獲取的數(shù)據(jù)以json對象類型放到state中的source變量中，問題就出在這里歉嗓！如果我們要從source中獲取數(shù)據(jù)丰介，用如下語句this.state.source[0].id來獲取id值會(huì)報(bào)錯(cuò)。（此處json數(shù)據(jù)為數(shù)組）
原因:
source:{},
由于初始賦值為{},而在setState()之前就用到this.state.source[0].id,此時(shí)source不是數(shù)組鉴分，也沒有id這個(gè)字段,{}只是undefined
注:setState語句在componentDidMount()時(shí)才執(zhí)行哮幢，而this.state.source[0].id在componentWillMount()時(shí)就執(zhí)行
解決方案:
source賦值為初始調(diào)用語句的對應(yīng)結(jié)構(gòu)
接著第二個(gè)問題
JSX語法之謎
錯(cuò)誤寫法
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>
)
以上寫法嚴(yán)重錯(cuò)誤，{}中應(yīng)該是屬性表達(dá)式冠场，更直觀的說應(yīng)該是已經(jīng)定義好的變量家浇。{}中可以使用條件表達(dá)式(？：)
