vue使用vue-resource,進行網絡請求

首先使用vue-resource,需要安裝 : https://blog.csdn.net/qq_36947128/article/details/72832977

 

下面我寫的一個例子:

網絡請求應該作為全局的,所以在項目的man.js中導入並使用它:

import VueResource  from 'vue-resource'

Vue.use(VueResource);

 

 

然后就是在自己寫的組件中使用了,怎么寫組件請看我前面的文章: https://www.cnblogs.com/fps2tao/p/9377652.html

我這里在我的listBox.vue中使用:

測試的接口地址: http://jsonplaceholder.typicode.com/users

<template>
    <div class="listBox">listBox222
        <li v-for="user in users">{{user.name}}</li>
    </div>
</template>

<script>


export default {
    name: "listBox",
    data:function(){
        return {'users':'test-ttt'}
    },
    created:function(){
        this.$http.get("http://jsonplaceholder.typicode.com/users").then(
            (data)=>{

                this.users = data.body;//可以打印,數據在body里面
        })
    }
}
</script>

<style scoped>

</style>

 

結果: