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>

你可能感兴趣的:(Vue.js,Vue.js,vue-resource)