Vue中使用axios发送ajax请求
作为前后端交互的重要技巧--发送ajax请求,在Vue中我们使用axio来完成这一需求:
首先是下载axios的依赖,
npm install --save axios vue-axios
然后在main.js中注册全局使用,
import Vue from 'vue'(基本项目建成就有,查看一下之前是否就有写,有的话可以省略)
import axios from 'axios'
import VueAxios from 'vue-axios'
Vue.use(VueAxios, axios) (注:这里划重点,不要管引入顺序,这里的use顺序一定不能变!important)
好了,接下来你就可以在你的项目中发送ajax请求了
Ex:
getStars() {
let url = 'https://api.github.com/search/repositories?q=v&sort=stars'
this.axios.get(url)
.then((res) => {
console.log(res)
})
.catch((err) => {
console.log(err)
})
}
这里请求的书写方式有很多种。大家怎么舒服怎么写
Vue.axios.get()
this.axios.get()
this.$http.get()
或者
getStars(){
let url = 'https://api.github.com/search/repositories?q=v&sort=stars'
this.axios({
method: 'get',
url: url
}).then((res) => {
console.log(res)
})
谢谢~
Vue中使用axios发送ajax请求的更多相关文章
- vue中使用axios进行ajax请求数据(跨域配置)
npm安装axios npm install axios --save 引入axios import axios from 'axios' 使用axios mounted () { this.getH ...
- 在vue中使用axios发送post请求,参数方式
由于后台接收的参数格式为FormData格式, 在axios中参数格式默认为, 在传参数前,将原先官方提供的格式 改为如下: axios({ url: '../../../room/listRoomP ...
- vue中采用axios发送请求及拦截器
这几天在使用vue中axios发送get请求的时候很顺手,但是在发送post请求的时候老是在成功的回调函数里边返回参数不存在,当时就纳闷了,经过查阅资料,终于得到了解决方案,在此做一总结: 首先我们在 ...
- Axios发送AJAX请求
目录 Axios 特征 axios提供主要三种发起请求的方式 方式一:直接axios实例直接call方式 方式二:通过axios实例提供的不同http请求方式的方法 方式三:其实是从第二种方式中单独提 ...
- Vue(七)发送Ajax请求
发送AJAX请求 1. 简介 vue本身不支持发送AJAX请求,需要使用vue-resource.axios等插件实现 axios是一个基于Promise的HTTP请求客户端,用来发送请求,也是vue ...
- js中使用队列发送ajax请求
最近,项目中需要按照先后顺序发送ajax请求,并且在一次请求结束后才能发起下一次,不然就会导致逻辑错误. 解决办法是定义一个数组,保存ajax请求数据. 以下使用extjs4定义一个类 Ext.def ...
- vue中使用axios发送请求
我们知道,vue2.0以后,vue就不再对vue-resource进行更新,而是推荐axios,而大型项目都会使用 Vuex 来管理数据,所以这篇博客将结合两者来发送请求 1.安装axios cnpm ...
- 使用axios发送ajax请求
1.安装 npm install axios 2.在Home.vue中引入 import axios from 'axios' export default { name: 'Home', c ...
- Vue中使用echarts,ajax请求的远程数据赋值给图表不刷新的问题和解决办法
问题: vue-cli搭建的项目,在mounted钩子函数里面创建echarts图表,本地模拟数据可以正常显示,但是当将ajax请求的远程数据赋值给图表时,图表并不会刷新. 解决办法: 刚开始以为是v ...
随机推荐
- 数位dp对于状态描述与发现的一些感悟
今天刷的数位dp 第一题看了题解以后知道了数位dp的基本板子,写数位dp的方式(运用记忆化递归的方法)已经基本固定. 那么接下来的难点主要还是对于题目描述的问题,如何抽象成dp中的状态.就今天刷的题来 ...
- zepto.js和jquery.js函数比较有什么优点?
1.Zepto.js 是专门为现代智能手机浏览器退出的 Javascript 框架, 拥有和jQuery相似的语法, 但是和jQuery相比下来, 他有很多优点, 大小方面 , 压缩后的 zepto. ...
- Choway Blog
choway 2018-12-11 09:23:46 JavaJVM Java 虚拟机(JVM)在执行 Java 程序时会把它管理的内存划分为多个不同的数据区域.这些区域各有用途,以及创建和销毁的时间 ...
- 安卓注解处理器-processor
最近在学习安卓开源框架发现,很多的开源框架都使用到了注解处理器,例如EventBus3.0.本文通过一个简单的Demo来介绍如何使用注解处理器.Demo链接为https://github.com/cu ...
- bzoj1603: [Usaco2008 Oct]打谷机 (纱布题)
Description Input Output Sample Input Sample Output Time Limit: 5 Sec Memory Limit: 64 MB Submit: 7 ...
- Android注解支持Support Annotations详解
###注解支持(Support Annotations)Android support library从19.1版本开始引入了一个新的注解库,它包含很多有用的元注解,你能用它们修饰你的代码,帮助你发现 ...
- 算发帖——俄罗斯方块覆盖问题一共有多少个解
问题的提出:如下图,用13块俄罗斯方块覆盖8*8的正方形. 那么一共可以有多少个解呢?(若通过旋转.翻转一个解而得到的新解,则两个解视为同一个解) 首先,求解的问题,已经在上一篇帖子里完成 算 ...
- scrapy爬虫-scrapy-redis分布式
1.如何将一个scrapy爬虫项目修改成为一个简单的分布式爬虫项目 官方文档:https://scrapy-redis.readthedocs.io/en/stable/ 只用修改scrapy项目的两 ...
- koa01
1.koa简介 koa是express团队开发的一个更加轻量级的服务端开发框架,也是未来的趋势 2.安装 npm i -g koa-generator //全局安装koa脚手架 3.创建项目 koa2 ...
- 浏览器内核之 HTML 解释器和 DOM 模型
微信公众号:爱写bugger的阿拉斯加如有问题或建议,请后台留言,我会尽力解决你的问题. 前言 此文章是我最近在看的[WebKit 技术内幕]一书的一些理解和做的笔记.而[WebKit 技术内幕]是基 ...