vue-resource

npm install --save vue-resourcevue

 

main.js,輸入npm

import Resource from 'vue-resource'api

Vue.use(Resource)函數

 

相應頁面使用:vue-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/81144883this

相關文章
相關標籤/搜索