vue2.0 Axios 的简单用法
安装
使用 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 的简单用法的更多相关文章
- vue2.0 axios封装、vuex介绍
一.前言 博主也是vue道路上的行者,道行不深,希望自己的东西能对大家有所帮助.这篇博客针对 了解过vue基础,但是没有做过vue项目的童鞋.如果想看基础指令,可以看我之前的一篇博客,请点击 跳转, ...
- vue2.0+element-ui(01简单点的单页面)
前言: 在<Vue.js权威指南>刚出版的时候,自己就作为一名前端粉捧了一把场,可是真是应了那句“出来混,总是要还的“这句话了,那时候信心满满的买来书想要认真研究,最终却还是把它搁浅了.直 ...
- Axios的简单用法
一转眼Vue 3.0都要发布了,学习使用Vue也有一段时间了,记录一下axios的用法 Axios 是一个基于 Promise 的 HTTP 库,可以用在浏览器和 node.js 中,有点类似于aja ...
- vue2.0 axios交互
vue使用axios交互时候会出现的问题大致有三个: 1:本地调试跨域问题? 2:post请求,传参不成功,导致请求失败? 3:axios引用,在使用的组件里面引用 解决方案: 问题一:跨域? 解决本 ...
- vue2.0 axios前后端数据处理
目前主流的 Vue 项目,都选择 axios 来完成 ajax 请求,而大型项目都会使用 Vuex 来管理数据. 前言: 使用 cnpm 安装 axios cnpm install axios -S ...
- Vue2.0 axios 读取本地json文件
参考:https://www.cnblogs.com/wdxue/p/8868982.html 1.下载插件 npm install axios --save 2.在main.js下引用axios i ...
- vue2.0修饰符sync用法
如果子组件是一个弹窗,我们想通过点击关闭按钮来关闭子组件弹窗,子组件弹窗的v-show由变量isVisible控制,这个变量通过props由父组件来注入, 而子组件无法改变props里面的变量的值,但 ...
- vue2.0实现购物车功能
购物车功能是一件比较繁琐的事情,逻辑功能太多,今天就用vue2.0实现一个简单的购物车功能,数据都本地自己写的假数据 功能列表: 1.全选和单选结算 2.减少和增加数量 3.商品的删除 界面搭建以及布 ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 二十三║Vue实战:Vuex 其实很简单
前言 哈喽大家周五好,马上又是一个周末了,下周就是中秋了,下下周就是国庆啦,这里先祝福大家一个比一个假日嗨皮啦~~转眼我们的专题已经写了第 23 篇了,好几次都坚持不下去想要中断,不过每当看到群里的交 ...
随机推荐
- cobbler自动安装
基础环境:centos7.2 本地IP地址:192.168.56.12 网络环境:桥接模式 一.安装cobbler # rpm -ivh http://mirrors.aliyun.com/epel/ ...
- 从github下载一个单一文件
以ubuntu + wget为例 1) 浏览器中打开需要需要下载的文件 2) 点击 raw按钮 3) 从浏览器地址栏中拷贝地址 4) wget + 地址
- 【转载】#458 Errors While Converting Between enum and Underlying Type
You can convert to an enum value from its underlying type by casting the underlying type (e.g. int) ...
- IOS 多媒体 使用总结
一.音频播放 1.音效播放(短时间的音频文件)1> AudioServicesCreateSystemSoundID2> AudioServicesPlaySystemSound 2.音乐 ...
- chrome不能用百度网盘极速上传插件的解决办法
进入chorme设置中,选择隐私设置中的内容设置,插件>自动运行,然后管理例外情况>添加“[*.]baidu.com”,后边当然选择允许,然后重启浏览器,OK了
- mydumper安装和使用
安装下载安装包:wget https://launchpad.net/mydumper/0.9/0.9.1/+download/mydumper-0.9.1.tar.gz 安装依赖包:yum inst ...
- LA 3415 保守的老师
题目链接:https://vjudge.net/contest/161820#problem/E 题意: 有一些同学,要从中选出一些同学来,人数尽量多,但是,两两之间要满足至少一个条件(身高差> ...
- 【转】Android应用程序窗口(Activity)窗口对象(Window)创建指南
在前文中,我们分析了Android应用程序窗口的运行上下文环境的创建过程.由此可知,每一个Activity组件都有一个关联的ContextImpl对象,同时,它还关联有一个Window对象,用来描述一 ...
- 【luogu P1004 方格取数】 题解
题目链接:https://www.luogu.org/problemnew/show/P1004 标准的DP,不明白为什么有普及+提高的难度 四维DP[i][j][k][l] 表示第一遍走到i,j格子 ...
- 【题解】洛谷P2341 [HAOI2006]受欢迎的牛(强连通分量)
洛谷P2341:https://www.luogu.org/problemnew/show/P2341 前言 这题看错题目 足足花了将近5小时提交了15次 在一位dalao的提醒下才AC了 记得要看清 ...