zoukankan      html  css  js  c++  java
  • vue---进行post和get请求

    参考文档:

    https://www.jb51.net/article/125717.htm

    使用axios

    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

    基本使用方法:

    get请求:

    // Make a request for a user with a given ID
    axios.get('/user?ID=12345')
     .then(function (response) {
      console.log(response);
     })
     .catch(function (error) {
      console.log(error);
     });
     
    // Optionally the request above could also be done as
    axios.get('/user', {
      params: {
       ID: 12345
      }
     })
     .then(function (response) {
      console.log(response);
     })
     .catch(function (error) {
      console.log(error);
     });
     

    Post请求:

    axios.post('/user', {
     firstName: 'Fred',
     lastName: 'Flintstone'
    })
    .then(function (response) {
     console.log(response);
    })
    .catch(function (error) {
     console.log(error);
    });

    简单示例:

    // 在进行 post 和 get 请求的时候,使用 axios 进行访问
    // 进行 get 请求
    axios.get(url).then(function (response){
        console.log(response);
    }).catch(function(error){
        console.log(error);
    });
    // 进行post 请求            
    axios.post(url,{firstName:'Fred',lastName:'Flintstone'}).then(function (response) {
        console.log(response);
    }).catch(function (error) {
        console.log(error);
    });

     这样发送请求,虽然是可以发送,但是携带的参数,是一个json字符串,会出现问题。所以我们在用post发送请求的时候,需要这样:

    axios({  
        method:'post',  
        url:url,  
        data:{title:this.title,content:this.content},  
        headers:{'Content-Type': 'application/x-www-form-urlencoded'},  
        transformRequest: function(obj) {  
            var str = [];  
            for(var p in obj){  
                str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));  
            }  
            return str.join("&");  
        }  
    }).then((res)=>{
        console.log(res.data);
    });

     上面这种只能提交一些简单的数据,对于复杂的数据,可以考虑使用 QS 对数据进行处理。

    使用方法,如果找不到QS文件,可以只用 npm 安装:

    npm install qs

    下载这个文件之后,使用 script 标签正常引入即可。

    使用方法:

    var formData = Qs.stringify({imgIds: [48,49],});
    axios.post(url,Qs.stringify(this.formData)).then(function (response) {
        console.log(response);
    }).catch(function (error) {
        console.log(error);
    });

    或者是:

    axios({
        method: 'post',
        url:url,
        data:Qs.stringify(this.formData),
    }).then((res)=>{
        console.log(res);
    });
  • 相关阅读:
    2020牛客多校第三场 G
    Travel Guide
    jQuery属性选择器中加变量
    css 两大特性:继承性和层叠性
    css 伪元素选择器
    css 伪类选择器
    css属性选择器
    css的高级选择器,后代选择器,子代选择器,并集选择器,交集选择器
    css 引入方式以及css的选择器
    HTML
  • 原文地址:https://www.cnblogs.com/e0yu/p/9949857.html
Copyright © 2011-2022 走看看