安装


使用 npm:

$ npm install axios

使用 bower:

$ bower install axios

使用 cdn:

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

用法


在main.js文件中,配置axios

//引入axios
import Axios from 'axios'; //将 axios 改写为 Vue 的原型属性
Vue.prototype.$axios = Axios;

在 main.js 中添加了这两行代码之后,就可以直接在组件的 created 钩子中使用 $axios 命令

created() {
this.$axios.post('https://www.easy-mock.com/mock/5b23687cf3c9fb2931a37f69/example')
.then(res => {
console.log(res.data);
})
.catch(error => {
console.log(error);
})
}

拦截器


在请求或响应被 then 或 catch 处理前拦截它们。

// 添加请求拦截器
axios.interceptors.request.use(function (config) {
// 在发送请求之前做些什么
return config;
}, function (error) {
// 对请求错误做些什么
return Promise.reject(error);
}); // 添加响应拦截器
axios.interceptors.response.use(function (response) {
// 对响应数据做点什么
return response;
}, function (error) {
// 对响应错误做点什么
return Promise.reject(error);
});

vue2.0 Axios 的简单用法的更多相关文章

  1. vue2.0 axios封装、vuex介绍

    一.前言 博主也是vue道路上的行者,道行不深,希望自己的东西能对大家有所帮助.这篇博客针对 了解过vue基础,但是没有做过vue项目的童鞋.如果想看基础指令,可以看我之前的一篇博客,请点击  跳转, ...

  2. vue2.0+element-ui(01简单点的单页面)

    前言: 在<Vue.js权威指南>刚出版的时候,自己就作为一名前端粉捧了一把场,可是真是应了那句“出来混,总是要还的“这句话了,那时候信心满满的买来书想要认真研究,最终却还是把它搁浅了.直 ...

  3. Axios的简单用法

    一转眼Vue 3.0都要发布了,学习使用Vue也有一段时间了,记录一下axios的用法 Axios 是一个基于 Promise 的 HTTP 库,可以用在浏览器和 node.js 中,有点类似于aja ...

  4. vue2.0 axios交互

    vue使用axios交互时候会出现的问题大致有三个: 1:本地调试跨域问题? 2:post请求,传参不成功,导致请求失败? 3:axios引用,在使用的组件里面引用 解决方案: 问题一:跨域? 解决本 ...

  5. vue2.0 axios前后端数据处理

    目前主流的 Vue 项目,都选择 axios 来完成 ajax 请求,而大型项目都会使用 Vuex 来管理数据. 前言: 使用 cnpm 安装 axios cnpm install axios -S ...

  6. Vue2.0 axios 读取本地json文件

    参考:https://www.cnblogs.com/wdxue/p/8868982.html 1.下载插件 npm install axios --save 2.在main.js下引用axios i ...

  7. vue2.0修饰符sync用法

    如果子组件是一个弹窗,我们想通过点击关闭按钮来关闭子组件弹窗,子组件弹窗的v-show由变量isVisible控制,这个变量通过props由父组件来注入, 而子组件无法改变props里面的变量的值,但 ...

  8. vue2.0实现购物车功能

    购物车功能是一件比较繁琐的事情,逻辑功能太多,今天就用vue2.0实现一个简单的购物车功能,数据都本地自己写的假数据 功能列表: 1.全选和单选结算 2.减少和增加数量 3.商品的删除 界面搭建以及布 ...

  9. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 二十三║Vue实战:Vuex 其实很简单

    前言 哈喽大家周五好,马上又是一个周末了,下周就是中秋了,下下周就是国庆啦,这里先祝福大家一个比一个假日嗨皮啦~~转眼我们的专题已经写了第 23 篇了,好几次都坚持不下去想要中断,不过每当看到群里的交 ...

随机推荐

  1. 科技巨头之微软-Microsoft

    提起微软Microsoft,我想应该是无人不知无人不晓.Windows操作系统,Office办公软件,是我们日常经常用到的工具.而微软的创始人正是前世界首富比尔盖茨. 1997年,我刚上初中.当时学校 ...

  2. 怎样下载YouTube播放列表视频

    YouTube上面的视频种类丰富多彩,要是你想利用上面的资源来学习的话,足够你钻研很长时间了.如果你想在YouTube上面学习一门教程,比如Python,通常这些内容一个视频肯定装不下,会分为好多个视 ...

  3. hihocoder 后缀自动机四·重复旋律6

    题目 对于\(k\in[1,n]\)求出长度为\(k\)的子串出现次数最多的出现了多少次 我直到现在才理解后缀自动机上的子树和是什么意思 非常显然的一点是 \[endpos(link(u))⊇endp ...

  4. POJ 2155 Matrix【二维树状数组+YY(区间计数)】

    题目链接:http://poj.org/problem?id=2155 Matrix Time Limit: 3000MS   Memory Limit: 65536K Total Submissio ...

  5. CentOS6.6上进程挂起的诡异问题和处理

    由于新的服务器不再支持CentOS5.4系统了,我们在新装机器上安装CentOS6.6.随着CentOS6.6机器的增多,我们逐渐注意到一个诡异问题:运行在这些机器上的某些进程,容易莫名其妙地挂起(举 ...

  6. 如何从GitHub获取源代码

    如何从GitHub获取源代码 github是当前流行的开源项目托管网站,里面有成千上万的项目值得学习和借鉴,可以把项目源代码下载到本地研究.本文介绍如何获取github的源代码. 方法1 - 克隆(C ...

  7. ORA-01950:对表空间 'USERS' 无权限

    在存储数据时出现ORA-01950:对表空间 'USERS' 无权限 错误,解决如下: 找到对象Users下的用户名,然后点编辑,角色权限添加dba 在oracle创建了一个新的表空间和一个新的用户, ...

  8. JavaScript函数变量作用域

    变量作用域 在JavaScript中,用var申明的变量实际上是有作用域的. 如果一个变量在函数体内部申明,则该变量的作用域为整个函数体,在函数体外不可引用该变量. 如果两个不同的函数各自申明了同一变 ...

  9. sudo cd的错误

    问题说明 今天用MySQL建了库,想看看. 当到了这步,心里的第一个感觉就是电脑坏了.后来查了查才知道了原因. 原因 cd不是一个应用程序而是Linux内建的命令,而sudo仅仅只对应用程序起作用. ...

  10. Flask—03-bootstrap与表单

    bootstrap与表单 Bootstrap是美国Twitter公司的设计师Mark Otto和Jacob Thornton合作基于HTML.CSS.JavaScript 开发的简洁.直观.强悍的前端 ...