HughRnApp/FetchTest.js at master · hughcoder/HughRnApp · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
/**
 * Created by penn on 2016/12/19.
 */

import React, {Component} from 'react';
import {
    StyleSheet,
    Text,
    Navigator,
    Image,
    View,
    ListView,
    RefreshControl,
    TouchableOpacity,
} from 'react-native';
import Toast, {DURATION} from 'react-native-easy-toast'
import HttpUtils from './HttpUtils'
import NavigationBar from './js/common/NavigationBar'
export default class FetchTest extends Component {
    constructor(props) {
        super(props);
        this.state = {
            result: ''
        }
    }

    load(url) {
        // fetch(url)
        //     .then(response=>response.json())
        //     .then(result=> {
        //         this.setState({
        //             result: JSON.stringify(result)
        //         })
        //     })
        //     .catch(error=> {
        //         this.setState({
        //             result: JSON.stringify(error)
        //         })
        //     })
        HttpUtils.get(url)
            .then(result=>{
                this.setState({
                    result: JSON.stringify(result)
                })
            })
            .catch(error=> {
                this.setState({
                    result: JSON.stringify(error)
                })
            })
    }

    post(url, data) {
        // fetch(url, {
        //     method: 'POST',
        //     headers: {
        //         'Accept': 'application/json',
        //         'Content-Type': 'application/json',
        //     },
        //     body: JSON.stringify(data)
        // })
        //     .then(response=>response.json())
        //     .then(result=> {
        //         this.setState({
        //             result: JSON.stringify(result)
        //         })
        //     })
        //     .catch(error=> {
        //         this.setState({
        //             result: JSON.stringify(error)
        //         })
        //     })
        HttpUtils.post(url,data)
            .then(result=>{
                this.setState({
                    result: JSON.stringify(result)
                })
            })
            .catch(error=> {
                this.setState({
                    result: JSON.stringify(error)
                })
            })
    }

    render() {
        return (
            <View>
                <NavigationBar
                    title="Fetch的使用"/>
                <Text style={styles.text} onPress={()=>this.load('http://rap.taobao.org/mockjsdata/11793/test')}>
                    加载数据
                </Text>
                <Text style={styles.text} onPress={()=>this.post('http://rap.taobao.org/mockjsdata/11793/submit',{userName:'小明',password:'123456'})}>
                    提交数据
                </Text>
                <Text style={styles.text}>请求结果:{this.state.result}</Text>
            </View>
        )
    }
}
const styles = StyleSheet.create({
    text: {
        fontSize: 20
    }
})