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

项目：

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>
);
}
}