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
  • 相关阅读:
    学习 iOS多线程开发 Demo示意
    python(数字Number)
    python(元组)
    python(列表)
    python(一)
    APP自动化测试框架搭建(转载)
    Appium真机运行Device Name获取方法
    关于android sdk manager在下载包时没有android intel x86 atom system image等项
    adb shell命令查看当前与用户交互的activity
    SDK更新
  • 原文地址:https://www.cnblogs.com/GetcharZp/p/14319436.html
Copyright © 2011-2022 走看看