axios在Vue组件中应用

axios在Vue组件中应用

Vue里面虽然有个vue-resource,但是在Vue2.0出来后,作者提倡用axios来做ajax,
在es6的环境下,可以直接:

npm install axios
import axios from ‘axios’

在es5中可以直接引用:

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

axios 里面有几个方法:

  • request(config)
  • get(url[, config])
  • delete(url[, config])
  • head(url[, config])
  • post(url[, data[, config]])
  • put(url[, data[, config]])
  • patch(url[, data[, config]])

其中config是自定义ajax配置,想了解的多一点可以点击:
axios中文文档

下面就来说说axios 在vue组件中如何应用

在vue的组件当中,直接获取axios是获取不到的,我们需要把axios赋给vue对象。
Vue.prototype.ajax=axios;this.ajax 。
这样就可以在vue组件中,调用axios

axios post请求,需要对传的参数进行转换,用axios自带的qs,
安装axios的时候会自动安装qs模块,我们只需要

import qs from 'qs';
var data = qs.stringify({
  name:'Eric'
});

这样服务器端才可以接受到参数

猜你喜欢

转载自blog.csdn.net/qq_24073885/article/details/71084807