vue使用axios进行ajax请求

以前都用resource进行ajax请求,现在官方推荐使用axios,所以现在更换插件。这篇文章主要描写如何在项目中引入axios以及简单地使用axios进行ajax请求。

第一步,需要通过npm安装插件,需要安装两个插件,它们分别是axios,vue-axios

npm install --save axios vue-axios

第二步,需要在项目中的入口js文件引入这两个插件

import Vue from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'

Vue.use(VueAxios,axios)

第三步,在项目中使用axios进行ajax请求

//写法1
Vue.axios.get(api).then((response)=>{
  console.log(response.data);//成功回调
},(response)=>{
  //失败回调
})
//写法2
this.axios.get(api).then((response)=>{
  console.log(response.data);//成功回调
},(response)=>{
  //失败回调
})
//写法3
this.$http.get(api).then((response)=>{
  console.log(response.data);//成功回调
},(response)=>{
  //失败回调
})

这就是axios请求ajax简单的例子。很简单,对吧?一起在项目中使用新的技术吧O(∩_∩)O~
vue-axios地址:https://github.com/imcvampire/vue-axios



作者:whiteMu
链接:https://www.jianshu.com/p/aa989357846c
转发

posted @ 2019-07-26 16:24  青竹玉简  阅读(553)  评论(0编辑  收藏  举报