fetch格式

fetch('url'+参数a, { method: "GET", body: json } .then(res => response.json()) .then(console.log(json)) ) 

 

一个发送post请求的示例:

fetch("http://127.0.0.1:7777/postContent", {
  method: "POST",
  headers: { "Content-Type": "application/json", }, mode: "cors", body: JSON.stringify({ content: "留言内容" }) }).then(function(res) { if (res.status === 200) { return res.json() } else { return Promise.reject(res.json()) } }).then(function(data) { console.log(data); }).catch(function(err) { console.log(err); });

fetch("/students.json")
.then(
    function(response){ if(response.status!==200){ console.log("存在一个问题，状态码为："+response.status); return; } //检查响应文本 response.json().then(function(data){ console.log(data); }); } ) .catch(function(err){ console.log("Fetch错误:"+err); });

1. class AwesomeProject extends Component {// 初始化模拟数据  
2.   
3.   
4.     constructor(props) {  
5.         super(props);  
6.   
7.         const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => {r1 !== r2}});  
8.         this.state = {  
9.             dataSource: ds,  
10.             load:false,  
11.             text:''  
12.         };  
13.     }  
14.   
15.     //耗时操作放在这里面  
16.     componentDidMount(){  
17.         this.getNet();  
18.     }  
19.   
20.     getNet(){  
21.         fetch('http://gank.io/api/search/query/listview/category/福利/count/10/page/1')//请求地址  
22.             .then((response) => response.json())//取数据  
23.             .then((responseText) => {//处理数据  
24.                 //通过setState()方法重新渲染界面  
25.                 this.setState({  
26.                     //改变加载ListView  
27.                     load: true,  
28.                     //设置数据源刷新界面  
29.                     dataSource: this.state.dataSource.cloneWithRows(responseText.results),  
30.                 })  
31.   
32.             })  
33.             .catch((error) => {  
34.                 console.warn(error);  
35.             }).done();  
36.     }  
37.   
38.     render() {  
39.         if(this.state.load){  
40.             return (  
41.                 <View style={{flex: 1, paddingTop: 22}}>  
42.                     <ListView  
43.                         dataSource={this.state.dataSource}  
44.                         renderRow={(rowData)=>  
45.                             <View>  
46.                                 <Image  
47.                                     style={{ width: 400, height: 250, marginTop: 5 }}  
48.                                     source={{uri:rowData.url}}/>  
49.                             </View>}  
50.                         />  
51.                 </View>  
52.             );  
53.         } else{  
54.             return(  
55.                 <View>  
56.                     <Text>loading......</Text>  
57.                 </View>  
58.             );  
59.         }  
60.     }  
61. }  

 

项目：

 

export default class View extends Component {
state = {
total: {},
}

 

componentDidMount() {
fetch('')
.then((response) => {
return response.json();
})
.then((data) => {
this.setState({total: data.data});
});
}

render() {
const {total: {usersCount, msgsCount}} = this.state;
return (
<div className="user-summary">
<div className="summary-top">
<h1>微信公众号汇总</h1>
<ul>
<li>总关注人数：<span>{usersCount}</span></li>
<li>总消息数：<span>{msgsCount}</span></li>
</ul>
</div>
</div>
);
}
}

 

 

转载于:https://www.cnblogs.com/liuna/p/6560595.html