铭记

最新推荐文章于 2025-09-08 22:40:31 发布

转载最新推荐文章于 2025-09-08 22:40:31 发布 · 89 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/Wjjxj/p/10141247.html

文章标签：

#json

本文详细介绍了在React Native中使用FlatList组件展示动态数据的方法，并实现了下拉刷新功能。通过fetch API进行前后端数据交互，展示了如何设置请求头、发送POST请求及处理响应数据。

<FlatList
data={this.state.stuList}
renderItem={this._renderItem}
keyExtractor={this._keExtractor}
ItemSeparatorComponent={this_reparator}
ListHeaderComponent={this._header}
onRefresh={this._onRefresh} 　　　　//下拉刷新头部事件
refreshing={this.state.refreshing}　　　　

/>
this.state={refreshing:false,
stuList:[]};

_renderItem=({item})=>{

return (<View>{item.Xxxx}</View>);
}

_keyExtractor=(item,index)=>{

return item.id.toString();
}

_separator=()=>{

return <View/>
}

_header=()=>{

return <View/>
}
_onRefresh=()=>{
fetch()....
}
-------------------------------------------

前后端连接
fetch(
" ",
{
method:"post",
mode:'cors',
headers:{
Accept:"application/json",
"Content-Type":"application/json"
},
body:JSON.stringify({username:"DeepL"})
}
).then(response=>respone.json())
.then(myjson=>{
this.setState({
ageEvent:china.name;
})
}).cathc(err=>{