vue封装了类似ajax的请求方法简单易用

要是用这个方法获取数据需要安装vue-resource。找到项目文件夹按住shift+右键选中启动命令符工具,输入npm install vue-resource --save(--save意思是安装到默认库里)

然后引入vue-resource。

vue请求数据

请求方式放在methods中。

其中有用到了es6的箭头函数,箭头函数的好处是代码简单,对于箭头函数内部的this不用在重新定义,这里的this指向vue的实例,这里使用es5的函数就需要在函数外部在定义一下this。

下面的生命周期函数mounted作用是在页面加载时就加载数据。

methods:{
    getData(){
        //请求数据

        var api='http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1';


        this.$http.get(api).then((response)=>{
            console.log(response);

            //注意this指向

            this.list=response.body.result;



        },function(err){

            console.log(err);

        })

    }
},
mounted(){
  this.getData();
}

相关文章: