/**
* Created by dongtao on 2017/4/23.
*/
/**
* React-Native Fatch网络请求工具类
* Songlcy create
* params:请求参数
* ES6 Promise 使用
* resolve 成功时候返回
* reject 失败时候返回
*/
export default class HttpUtils {
//基于 fetch 封装的 GET请求
static getFatch(url) {
return new Promise((resolve, reject) => {
fetch(url)
.then((response)) => {
if (response.ok) {
return response.json();
} else {
reject({status:response.status})
}
})
.then((response) => {
resolve(response)
})
.catch((error) => {
reject(error)
})
})
}
//基于 fetch 封装的 POST请求
static postFatch(url, params) {
return new Promise((resolve, reject) => {
fetch(url, {
method: 'POST',
header: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify(params)
})
.then((response)) => {
if (response.ok) {
return response.json();
} else {
reject({status:response.status})
}
})
.then((response) => {
//成功返回
resolve(response)
})
.catch((error) => {
//失败返回
reject(error)
})
})
}
使用方法
import HttpUtils from './HttpUtils'
export default class UserFatch extends Component {
HTTPUtil.post(url, params)
.then((json) => {
//处理 请求success
if(json.code === 0 ){
//我们假设业务定义code为0时，数据正常
}else{
//处理自定义异常
this.doException(json);
}
},(json) => {
//TODO 处理请求fail
})
}
下面的使用回调函数来封装的Fatch网络请求
/**
* Created by dt on 2017/4/23.
*/
/**
* 网络请求工具类
* Songlcy create
* params:请求参数
* successCallback:成功回调
* failCallback:失败回调
*/
import RootToast from '../pages/RootToast/RootToast'
import Environment from '../environment/Environment'
import ShowProgress from '../pages/ProgressHUD/ShowProgress';
const host = 'https:doSubmit.do'
const showProgress = new ShowProgress;
let Network = {
postNetwork: (params,successCallBack, failCallBack)=> {
if(params.isProgress === '1' ){
showProgress.show();
}
console.log('***********************网络请求报文******************************');
console.log( JSON.stringify(params));
console.log('================================================================');
// const host = Environment.host();
paramStr = 'transCode=' + params.transCode + '&requestBodyJson=' + JSON.stringify(params.request);
fetch(host,
{
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8',
},
body: paramStr
}
).then((response) => {
showProgress.hidden();
if (response.ok) {
return response.json();
} else {
RootToast.show('服务器连接异常');
}
}).then((response) => {
console.log('***********************成功返回****************************');
console.log( JSON.stringify(response));
console.log('================================================================');
if (response.responseBody == null) {
RootToast.show(response.errorMsg);
if (failCallBack && typeof(failCallBack) == 'function'){
failCallBack(response);
}
} else {
successCallBack(response);
}
}).catch((error) => {
showProgress.hidden();
console.log(error.message);
if (failCallBack && typeof(failCallBack) == 'function') {
failCallBack(error);
}
})
}
}
export default Network;
使用方法
var params = {
transCode: 'D1',
request: {
"loginName": global.loginName,
"Password": oldPassword，
},
isProgress: '1'
};
Network.postNetwork(params, (response)=>{
alert(response.responseBody.message);
//修改成功
if (response.responseBody.updateStatus === '1') {
this.props.navigator.pop();
}
}, (response)=>{
alert(response.errorMsg);
});
componentDidMount() {
let params = {
transCode: 'D1',
request: {
loginName: global.loginName,
},
isProgress:'1'
}
Network.postNetwork(params,this.successCallBack.bind(this),this.failCallBack.bind(this));
}
//请求成功
successCallBack(responseData) {
if (responseData.responseBody.poicyModels && responseData.responseBody.poicyModels.length) {
let ds = new ListView.DataSource({
rowHasChanged: (row1, row2) => row1 !== row2,
});
this.setState({
dataSource: ds.cloneWithRows(responseData.responseBody.poicyModels),
noListData: false,
});
} else {
this.setState({
noListData: true,
});
}
}
failCallBack(error){
this.setState({
});
}
网友评论