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
import React,{ Component } from
'react'
;
import {
AppRegistry,
StyleSheet,
Text,
View
} from
'react-native'
;
);
class App extends Component {
constructor(props) {
super
(props);
this
.state = {
responseText :
null
};
}
//渲染
render() {
return
(
<View style={styles.container}>
<Text style={styles.item} onPress={
.doRequest.bind(
)}>获取数据</Text>
<Text>{
.state.responseText}</Text>
</View>
);
}
//开始请求数据
doRequest(){
_that =
;
request.get(
'https://httpbin.org/get'
)
.end(
function
(err,res){
_that.setState({responseText: res.text})
console.log(res);
});
}
}
//样式定义
const styles = StyleSheet.create({
container:{
flex: 1,
marginTop:25
},
item:{
margin:15,
height:30,
borderWidth:1,
padding:6,
borderColor:
'#ddd'
,
textAlign:
'center'
});
AppRegistry.registerComponent(
'ReactDemo'
二、 基本用法
1,下面是一个简单的 Get 请求
2,使用方法字符串写法也是可以的
3
request(
'GET'
).end(
alert(res.text);
3,支持 ES6,可以使用 .then() 来代替 .end()
4,除了 GET,DELETE,HEAD,POST,PUT 以及其他 HTTP 请求都可使用
注意:由于
DELETE
是特殊的保留字段,方法命名为
.del()
1
request.del(
5,如果是 GET 请求,可以使用下面的最简写法
三、请求头设置(header fields)
1,可以使用 .set() 方法单独设置每个字段
1
2
3
6
)
.set(
'API-Key'
'foobar'
)
'Accept'
'application/json'
)
alert(res.text);
2,也可以使用对象同时设置多个字段
2
5
.set({
:
})
alert(res.text);
四、GET 请求说明
.query()
方法可以接收参数并生成查询串,同时该方法可以接收多种类型的参数。
1,.query() 方法可以接收对象类型的参数 比如下面样例最终得到的请求路径为:
https://httpbin.org/get?query=Manny&range=1..5
1
2
3
4
5
6
|
request.get(
'https://httpbin.org/get'
)
.query({ query:
'Manny'
})
.query({ range:
'1..5'
})
.end(
function
alert(res.text);
});
|
当然把所以参数放在一个对象中也可以:
2
3
5
})
alert(res.text);
});
|
2,.query() 方法也接受字符串类型的参数
.query(
'search=Manny'
)
'range=1..5'
)
});
当然把多个参数字符串写在一起也是可以的:
'search=Manny&range=1..5'
)
});
五、POST/PUT 请求说明
1,JSON 方式提交数据(application/json)
(1)发送一个
JSON字符串
request.post(
'https://httpbin.org/post'
.set(
'Content-Type'
'application/json'
.send(
'{"name":"tj","pet":"tobi"}'
});
(2)也可以发送
JSON对象,下面代码效果同上面一样。
.send({ name:
'tj'
'tobi'
});
可以多次使用
.send()方法将发送的数据分开。
2,form 表单方式提交数据(application/x-www-form-urlencoded) (1)如果发送的是字符串,默认情况下就是使用
form方式提交数据
(2)通过设置
Content-Type,也可以使下面对象使用
form方式提交数据。
'application/x-www-form-urlencoded'
});
使用
.type()方法可以很方便地设置
Content-Type,下面代码效果和上面一样。
3,POST 请求同样可以设置查询字符串
.query()可以建立一个查询字符串,添加到链接地址后面:
?format=json&dest=/login
6
7
.query({ format:
'json'
.query({ dest:
'/login'
})
alert(res.text);
});
|
六、设置 Content-Type
1,使用 .set() 方法进行完整设置
2,使用 .type() 进行快速设置 (1)该方法既接受规范的
MIME类型名称。
(2)也接受简单的扩展名称,比如:
xml、
json、
png等等。
七、自动重新请求 使用
.retry()方法,当请求失败或网络异常时,会继续尝试再次请求。
该方法可以设置最大尝试次数(失败次数),默认值为
3。
原文出自:
www.hangge.com
转载请保留原文链接:
http://www.hangge.com/blog/cache/detail_1622.html (编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!
|
| | |