vue中axios的简单使用

我们一般在用jq的时候会使用到ajax来进行与服务器之间的交流，vue中也提供了相应的类似于ajax的方法-axios来进行与服务器之间的数据传递

现在的这篇是最简单的使用，后续会添加上来复杂的使用

首先安装axios

引入方式：
$ npm install axios
//使用淘宝源
$ cnpm install axios
//或者使用cdn：
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

　　

安装其他插件的时候，可以直接在 main.js 中引入并使用 Vue.use()来注册，但是 axios并不是vue插件，所以不能 使用Vue.use()，所以只能在每个需要发送请求的组件中即时引入。

为了解决这个问题，我们在引入 axios 之后，通过修改原型链，来更方便的使用。

//main.js

import axios from 'axios'
Vue.prototype.$http = axios

需要用到的地方
简单的post的请求

self.$axios.post(self.url, { page: self.cur_page }).then((res) => {
        /* alert(res.data.data.list);*/
        this.tableData = res.data.data.list;
        this.page_total = this.tableData.length;
      }, (res) => {
        console.log("失败");
      })

　　简单的get请求

mounted() {
      this.$http.get('../../../static/json/hotcity.json').then((res) => {
      this.hotcity = res.data.hotcity;
      }, (res) => {
      console.log("error");
     })
    }