zoukankan      html  css  js  c++  java
  • React封装fetch的get与post请求

    新建http.js文件用来封装get和post请求

       1、封装get请求

       

       2、封装post请求

      

       3、测试

      首先在其他组件引入,注意:分析

      

    引入类和方法的区别:
        React等类直接写即可
        方法需要在外面用{}包围

      封装之前写法

      

       封装完成后调用httpPost写法,这里data为对象格式即可

      

       get方法与之类似

      小结:封装完整代码如下

    复制代码
    // 封装get请求
    export function httpGet(url){
        var result = fetch(url)
        return result
    }
    // 封装post请求
    export function httpPost(url,data){
        var result = fetch(url,{
            method:'post',
            headers:{
                'Accept':'application/json,text/plain,*/*',/* 格式限制:json、文本、其他格式 */
                'Content-Type':'application/x-www-form-urlencoded'/* 请求内容类型 */
            },
            //data表单数据,body最终要的格式为username=tony&pwd=123456,所以需要格式化
            body:paramsPostBody(data)
        })
        return result
    }
    //格式化data
    function paramsPostBody(obj){
        var result = '';//接受最后结果
        var item;
        for(item in obj){
            result += '&'+item+'='+encodeURIComponent(obj[item])
        }
        if(result){
            result = result.slice(1)//去掉第一个&
        }
        return result
    }
    复制代码

      

  • 相关阅读:
    SDK manager打不开解决办法(转载)
    debian安装中文字体
    rtos之定时器实现
    rtos学习之支持多优先级
    RT-Thread 的空闲线程和阻塞延时
    RT-Thread之对象容器
    RT-Thread 之临界段保护
    RT-Thread之线程实现就绪列表
    rtos 学习之链表
    RTOS 的学习之创建线程
  • 原文地址:https://www.cnblogs.com/jianxian/p/12377690.html
Copyright © 2011-2022 走看看