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

作者: 金丝楠 | 来源:发表于2017-03-15 10:42 被阅读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);
      });
    }
    

    相关文章

      网友评论

      • 羊太郎_胡一:非常感谢 看了好多文章 你这个最好用
      • 起岸:ios上运行,写了let formData = new FormData();,但是报Can't find variable: FormData错误是为什么,

      本文标题:RN笔记-Fetch网络请求GET/POST

      本文链接:https://www.haomeiwen.com/subject/meclnttx.html