vue 开发:axios前后端数据处理

         这几天学习vue整个人都蒙逼了,下面写一下自己理解的vue与后端怎么进行交互的...

了解axios:

      axios是一个基于promise,为浏览器和node.js设计的Http客户端。具有以下特征:

  •         从浏览器中创建XMLHttpRequest
  •         从node.js发出http请求
  •        支持Promise API
  •        拦截请求和响应
  •        转换请求和相应数据
  •        取消请求
  •        自动转换json数据
  •        客户端支持防止 CSRF/XSRF

 接下来,如何调用后端接口?

1、安装axios

     npm  install   axios  -S

2、在main.js中引入axios

      import  axios  from  'axios'

      Vue.prototype.$http = axios      #进行http请求

3、vue在配置文件中提供了proxyTable来设置跨域,在config文件夹的index.js文件中

     vue 开发:axios前后端数据处理

4、在main.js中全局默认设置 Global  axios  default

     vue 开发:axios前后端数据处理

5、axios方法封装 (一般会用到get、post、delete、put、catch等)手动建在src文件夹下assets文件夹下的js文件夹中的http.js中

     vue 开发:axios前后端数据处理

vue 开发:axios前后端数据处理

6、为了方便和便于整理,将前台需要的接口整理到了一个文件中。手动创建了service文件夹下的getData.js文件

     vue 开发:axios前后端数据处理


就先记下这么多......