在vue组件中使用axios的方法


Posted in Javascript onMarch 16, 2018

现在我们通过webpack+vue-cli搭建起了一个vue项目的框架,如果我们需要在vue组件中使用axios向后台获取数据应该怎么办呢?

通常情况下,我们搭建好的项目目录应该是这样子的

在vue组件中使用axios的方法

首先需要安装axios,这个会npm的都知道

下一步,在main.js中引入axios

import axios from "axios";

在vue组件中使用axios的方法

与很多第三方模块不同的是,axios不能使用use方法,转而应该进行如下操作

Vue.prototype.$axios = axios;

在vue组件中使用axios的方法

接着,我们就可以在App.vue中使用axios了

created:function(){
 this.$axios.get("/seller",{"id":123}).then(res=>{
  console.log(res.data);
 });
}

在vue组件中使用axios的方法

以上这篇在vue组件中使用axios的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
JS中style属性
Oct 11 Javascript
java与javascript之间json格式数据互转介绍
Oct 29 Javascript
YUI模块开发原理详解
Nov 18 Javascript
arguments对象验证函数的参数是否合法
Jun 26 Javascript
js拖拽的原型声明和用法总结
Apr 04 Javascript
jQuery实现下拉框功能实例代码
May 06 Javascript
Angular 页面跳转时传参问题
Aug 01 Javascript
js实现可旋转的立方体模型
Oct 16 Javascript
分分钟学会vue中vuex的应用(入门教程)
Sep 14 Javascript
原生JavaScript实现Ajax异步请求
Nov 19 Javascript
JavaScript设计模式之工厂模式简单实例教程
Jul 03 Javascript
Vue OpenLayer测距功能的实现
Apr 20 Vue.js
axios发送post请求,提交图片类型表单数据方法
Mar 16 #Javascript
Vue实现搜索 和新闻列表功能简单范例
Mar 16 #Javascript
vue axios 表单提交上传图片的实例
Mar 16 #Javascript
vue中实现图片和文件上传的示例代码
Mar 16 #Javascript
vue中手机号,邮箱正则验证以及60s发送验证码的实例
Mar 16 #Javascript
Vue实现active点击切换方法
Mar 16 #Javascript
详解Vue.js项目API、Router配置拆分实践
Mar 16 #Javascript
You might like
人族 Terran 魔法与科技
2020/03/14 星际争霸
php设计模式 Delegation(委托模式)
2011/06/26 PHP
PHP中创建空文件的代码[file_put_contents vs touch]
2012/01/20 PHP
php变量作用域的深入解析
2013/06/03 PHP
php读取csv数据保存到数组的方法
2015/01/03 PHP
PHP答题类应用接口实例
2015/02/09 PHP
php微信公众号开发之二级菜单
2018/10/20 PHP
Laravel 模型关联基础教程详解
2019/09/17 PHP
javascript之可拖动的iframe效果代码
2008/08/01 Javascript
Jquery读取URL参数小例子
2013/08/30 Javascript
通过length属性判断jquery对象是否存在
2013/10/18 Javascript
JavaScript中使用stopPropagation函数停止事件传播例子
2014/08/27 Javascript
js结合正则实现国内手机号段校验
2015/06/19 Javascript
原生js实现回复评论功能
2017/01/18 Javascript
微信小程序多列选择器range-key使用详解
2020/03/30 Javascript
vue 导航守卫和axios拦截器有哪些区别
2020/12/19 Vue.js
python日志记录模块实例及改进
2017/02/12 Python
Python学习笔记之if语句的使用示例
2017/10/23 Python
详细分析python3的reduce函数
2017/12/05 Python
Python3生成手写体数字方法
2018/01/30 Python
对pandas写入读取h5文件的方法详解
2018/12/28 Python
pycharm远程开发项目的实现步骤
2019/01/20 Python
python使用正则来处理各种匹配问题
2019/12/22 Python
python不使用for计算两组、多个矩形两两间的iou方式
2020/01/18 Python
python中数字是否为可变类型
2020/07/08 Python
通过Python实现Payload分离免杀过程详解
2020/07/13 Python
Django DRF APIView源码运行流程详解
2020/08/17 Python
plt.figure()参数使用详解及运行演示
2021/01/08 Python
使用html5+css3来实现slider切换效果告别javascript+css
2013/01/08 HTML / CSS
澳大利亚快时尚鞋类市场:Billini
2018/05/20 全球购物
销售员未完成销售业绩的检讨书
2014/10/12 职场文书
慰问信模板
2015/02/14 职场文书
银行实习推荐信
2015/03/27 职场文书
公司会议开幕词
2016/03/03 职场文书
Python 如何利用ffmpeg 处理视频素材
2021/11/27 Python
Python万能模板案例之matplotlib绘制甘特图
2022/04/13 Python