ReactNativeReactNative笔记React-Native学习

RN笔记-Fetch网络请求GET/POST

2017-03-15  本文已影响5117人  金丝楠

发送Fetch网络请求时需要注意,如果服务端返回的json数据是string类型的,在解析时要先将其JSON格式化,否则在更新数据源时会逐个遍历string字符。

// 将字符串JSON格式化
JSON.parse(responseData)

// 将JSON数据转化为字符串
JSON.stringify(responseData)
    //更新数据源
    this.setState({
      dataSource:this.state.dataSource.cloneWithRows(JSON.parse(responseData).data)
    });

GET请求(无参数)
 startGetRequest(){
   fetch(this.props.api_url)
  .then((response) => response.json()) //下一步操作
  .then((responseData) => {
    console.log(responseData); //打印出来
    // alert(responseData);
    });
  })
  .catch((error)=>{
    alert(error);
  })
}

GET请求(有参数)
  GetNormal(url,params){
          if (params) {
              let paramsArray = [];
              //拼接参数
              Object.keys(params).forEach(key => paramsArray.push(key + '=' + params[key]))
              if (url.search(/\?/) === -1) {
                  url += '?' + paramsArray.join('&')
              } else {
                  url += '&' + paramsArray.join('&')
              }
          }
          //fetch请求
          fetch(url,{
              method: 'GET',
          })
              .then((response) => response.json())
              .then((json) => {
                  console.log('json'+JSON.stringify(json));
                  //动态赋值
                  this.setState({
                    dataSource: json.data
                  })
              })
              .catch((error) => {
                  //alert(error)
              })
      }

//调用方法
  getBannerData(){
    let Url = Server+'/etspace/activity/list';
    this.GetNormal(Url,{'pageindex':'1','pagesize':'5'});
  }

Post请求
startPostRequest(){

  var url = Service.eduConsultUrl;
  let formData = new FormData();

  // 请求参数 ('key',value)
  formData.append('extend', extend);
  formData.append('classid','439');
  formData.append('pageSize','5');

  fetch(url,{
    method:'POST',
    headers:{
        'Content-Type':'multipart/form-data',
    },
    body:formData,
  })
  .then((response) => response.text() )
  .then((responseData)=>{
    console.log('responseData',responseData);
    // json格式化  JSON.stringify(responseData)转字符串
    console.log('json格式化',JSON.parse(responseData));
    // alert(responseData);
  })
  .catch((error)=>{console.error('error',error)
      alert(error);
  });
}
上一篇下一篇

猜你喜欢

热点阅读