一、使用vue官方的vue-resource 插件請求數(shù)據(jù)

1.安裝vue-resource :

        cnpm install vue-resource --save 
        //說明：帶--save 或 -S 意思是將其寫入到package.json文件中，供拷貝代碼后添加使用

2.在main.js中引入vue-resource

        import VueResource from 'vue-resource';
        Vue.use(VueResource);

3.在組件中直接使用：

    methods:{
        getListData(){//網(wǎng)絡(luò)請求數(shù)據(jù)
            var url = "http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1";
             //jsonp請求，需要后臺接口支持jsonp
             // this.$http.jsonp(api).then((response)=>{
            //get請求
            this.$http.get(url).then((response)=>{
                console.log("請求到的數(shù)據(jù)："+response);
                this.list = response.body.result;
            },(error)=>{
                console.log("請求錯誤："+error);
            })
        },
    },
    mounted(){//模板已經(jīng)編譯 -- 執(zhí)行請求數(shù)據(jù)的操作
        this.getListData();
    }

二、使用vue官方的axios 插件請求數(shù)據(jù)

1. 安裝  cnpm  install  axios --save
2.每一個地方使用網(wǎng)絡(luò)請求，就在那個地方引入axios，然后直接用就行
            import Axios from 'axios';
3.使用
         var url = "http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1";
            Axios.get(url).then((response)=>{
                    this.msglist=response.data.result;
                    console.log("請求到的數(shù)據(jù)66666："+response);
                }).catch((error)=>{
                    console.log(error);
                })