vue中ajax怎么请求数据,怎么在vue中使用ajax获取后台数据并显示

怎么在vue中使用ajax获取后台数据并显示

发布时间：2021-04-12 18:04:05

来源：亿速云

阅读：73

作者：Leah

怎么在vue中使用ajax获取后台数据并显示？很多新手对此不是很清楚，为了帮助大家解决这个难题，下面小编将为大家详细讲解，有这方面需求的人可以来学习下，希望你能有所收获。

实例如下所示：html>

Title

#th th{

background-color: #50a9fa;

color: aliceblue;

font-size: large;

}

添加数据

编号	名称	时间	操作
{{item.id}}	{{item.name}}	{{item.ctime}}	删除

//vue的生命周期

new Vue({

el:'#app',

data:{

list:[]

},

//vue对象实例创建成功之后就会自动调用这个方法

//如果你想写的方法在舒适化的时候就被调用的话就要要用到created这个

created:function () {

this.getlist();//这里定义这个方法，vue实例之后运行到这里就调用这个函数

},

methods:{

getlist:function () {

//请求服务器的api获取到品牌的数据列表

this.$http.get('http://vueapi.ittun.com/api/getprodlist').then(function (response) {

//处理服务器异常信息提示

if(response.body.status!=0)

{

alert(response.body.message);

return ;

}

//处理正常的逻辑数据处理

this.list=response.body.message;

});

}

}

});

看完上述内容是否对您有帮助呢？如果还想对相关知识有进一步的了解或阅读更多相关文章，请关注亿速云行业资讯频道，感谢您对亿速云的支持。