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

发送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);
  });
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,773评论 19 139
  • iOS网络架构讨论梳理整理中。。。 其实如果没有APIManager这一层是没法使用delegate的,毕竟多个单...
    yhtang阅读 10,667评论 1 23
  • 老班主任:有威望,能镇住场 老班长:核心组织者,老好人性格 班花:人见人爱,社群的润滑油 较真儿者:唱反调,引发大...
    邢大侠阅读 4,210评论 0 0
  • 7月结束,才真正意识到2015年已经过去了一半。2015年春节较晚,导致上学期时间长,而这学期返校已是3月。在不到...
    leileely阅读 2,481评论 0 3
  • 步步惊心丽主题曲 EXO 为了你 伯贤 CHEN XIUMIN
    卟尼与鹿阅读 3,276评论 0 1