zoukankan      html  css  js  c++  java
  • 怎么在Vue中使用axios组件

    怎么在Vue中使用axios组件:

    通过npm安装axios

    npm i axios
    

    src/main.js中导入该组件

    import axios from 'axios'
    

    axios常用请求

    GET :

    // 为给定 ID 的 user 创建请求
    axios.get('/user?ID=12345')
      .then(function (response) {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      });
    
    // 上面的请求也可以这样做
    axios.get('/user', {
        params: {
          ID: 12345
        }
      })
      .then(function (response) {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      });
    

    POST :

    // 参数在 url 后通过对象指定
    // 发送 Form Data 数据,要使用 qs包
    /*
    1、npm i qs
    2、main.js 中引入这个包: import qs from "qs"
    3、将qs设置为Vue的属性:  Vue.prototype.$qs = qs
    */
    
    let data = this.$qs.stringfy({
        firstName: 'Fred',
        lastName: 'Flintstone'
    })
    axios.post('/user', data)
      .then(function (response) {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      });
    

    PUT :

    axios.put()
    

    DELETE :

    axios.delete()
    

    axios 全局配置

    import  axios  from  'axios'
    // axios全局配置
    Vue. prototype. $http =  axios
    axios. defaults. baseURL =  host
    // 配置该Content-Type后请求的post数据默认为 FormData 格式
    axios. defaults. headers[ 'Content-Type'] =  'application/x-www-form-urlencoded'
    axios. defaults. headers[ 'XPS-Version'] =  '1.0.0'
    
    Aspire to inspire until I expire
  • 相关阅读:
    HDU 3729【二分匹配】
    51nod 1456【强连通,缩点,并查集】
    51nod1459【二级最短路】
    51nod1640 【最小生成树】
    CodeForces660B【模拟—水】
    CodeForces691C 【模拟】
    Codeforces698B【并查集+拆环】
    CodeForces717C 【数学】
    Codeforces710C【数学】
    HDU5904【瞎搞】
  • 原文地址:https://www.cnblogs.com/GetcharZp/p/14319436.html
Copyright © 2011-2022 走看看