Vue.js Ajax(vue-resource)

Vue -resource是vue的一个用来异步请求服务器数据的插件。

1:安装

可以在编译器或者控制台下通过命令行来安装：npm install vue-resource --save-dev，安装完成可以在node_moduls文件夹下找到vue-resource文件夹，即代表安装成功。

2：使用

1. 首先需要在main.js中通过import语句将其引用。
2. 然后通过vue的use方法告诉我们要使用vue resource
3. 如下：

import VueResource from 'vue-resource'
Vue.use(VueResource)

4. 然后要在App.vue的script部分添加代码：

 created () {
      this.$http.get('/api/seller').then((response) => {
        response = response.body
        if (response.errno === ERR_OK) {
          this.seller = response.data
          console.log(this.seller)
        }
      })
    },

其中请求方式有两中分别为get和post ，具体使用参数情况不一致。例子中用的get请求且没有参数传递。

5. 需要修改自定义组件的结构与data的结构

 data () {
      return {
        seller: {}
      }
    },

<v-header v-bind:seller="seller"></v-header>

【注】v-bind不能丢（或者替换为：）

6. 在自定义组件中，对export default中添加下面的代码：

 export default {
      props: {
        seller: {
          type: Object
        }
      }
    }

调用请求的数据时，需要使用v-bind或者“：”，如下：

<img width="64" height="64" :src="seller.avatar">