vue-resource

npm install --save vue-resource

 

main.js,输入

import Resource from 'vue-resource'

Vue.use(Resource)

 

相应页面使用:

<template>
  <div id="demo42">   
      <p>---------vue-resource $http请求数据---------</p>
    <button @click="getData">请求数据</button> 
    <ul>
      <li v-for="(item,index) in list" :key="index">pinyin:{{item.pinyin}},area_code:{{item.area_code}},name:{{item.name}}</li>
    </ul>
  </div>
</template>

<script> 
export default {
  data() {
    return {
      list: []
    };
  },
  methods: {
    getData() {
      //请求数据
      var api =
        "http://cangdu.org:8001/v1/cities?type=group";

      this.$http.get(api).then(
        response => {
          console.log(response);   
          this.list = response.data.E;
        },
        function(err) {
          console.log(err);
        }
      );
    }
  },
  mounted() {
    /*生命周期函数*/
    this.getData();
  }
};
</script>

 

 

 

vue-resource的安装及使用 https://blog.csdn.net/weixin_37719279/article/details/81144883

posted @ 2019-06-22 22:17  BloggerSb  阅读(160)  评论(0编辑  收藏  举报