天天看點

vue-resource請求資料

  1. 需要安裝vue-resource子產品

    npm install vue-resource –save

  2. main.js檔案裡引入和使用vue-resource
import VueResource from 'vue-resource' 
Vue.use(VueResource)
           

3、 在元件中直接使用

<template>
  <div id="list">
      <button @click="requestBtn()">請求資料</button>
      <ul>
          <li v-for="item in list">{{item.catname}}</li>
      </ul>
  </div>
</template>

<script>
export default {
  name: 'list',
  data () {
    return {
        list:[]
    }
  },
  methods: {
      requestBtn:function(){
          var url = "http://www.phonegap100.com/appapi.php?a=getPortalCate"
         this.$http.get(url).then(res =>{
             this.list = res.data.result
         },res => {

         })
      }
  }
}
</script>
<style lang="sass" scoped>

</style>
           

繼續閱讀