vue视频教程系列第四十三节-与后台通信axios

目前很多流行的vue项目都选择axios来完成ajax请求，我们今天就一起学习一下axios。

使用axios的前奏：

1. 安装axios

npm install axios –save-dev

2. 在main.js里引入axios

import axios from 'axios'

引入之后，在组件里还是不可以使用axios命令的，而且也不能用use，这时候我们就将$axios作为vue的原型属性添加到vue上，并将其指向axios，所以

3. Vue.prototype.$axios= axios
   

4. 在vue的实例里注册

new Vue({

  router,

  axios, 

  render: h => h(App)

}).$mount('#app')

屏幕快照 2018-10-29 上午8.45.34.png

Axios的准备工作完毕，接下来就是使用了，如何使用呢？其语法为

this.$axios.get(“url”)

.then((res) =>{

  Console.log(‘请求成功的回调函数’)

})

.catch((err){

  Console.log(‘请求失败的回调函数’)

})

Vue有一个官方推荐的ajax 插件 vue-resource，网上传其在vue2之后就不再更新了，所以很多的主流项目都选择axios来完成ajax请求。我还特意看了vue的github上，最近也是有更新的。如果大家有兴趣的话可以用vue-resource去练习一下，其流程等与axios类似，在此就不再赘述了。

就到这里了，休息休息一会儿吧：）明天继续加油噢！