详解详解vue与后端数据交互与后端数据交互(ajax)：：vue-resource
本篇文章主要介绍了详解vue与后端数据交互(ajax)：vue-resource，具有一定的参考价值，感兴趣的小伙伴们可以参考一下。
本人对vue与后端数据交互不是很懂,搜索了很多关于vue与后端数据交互介绍,下面我来记录一下,有需要了解的朋友可参考。希望此文章对各位有所帮
助。
必须引入一个库：vue-resource
1.获取普通文本数据获取普通文本数据
比如:a.txt:
welcomet to vue!!!
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<script src="http://unpkg.com/vue/dist/vue.js"></script>
<script src="https://cdn.jsdelivr.net/vue.resource/1.0.3/vue-resource.min.js"></script>
<script type="text/javascript">
window.onload = function(){
var vm = new Vue({
el:'#box',
data:{
msg:'Hello World!',
},
methods:{
get:function(){
//发送get请求
this.$http.get('a.txt').then(function(res){
alert(res.body);
},function(){
console.log('请求失败处理');
});
}
}
});
}
</script>
</head>
<body>
<div id="box">
<input type="button" @click="get()" value="按钮">
</div>
</body>
</html>
上面代码实现了，点击按钮，就发送get请求，然后把拿到的数据alert出来。
2.get发送数据给后端发送数据给后端
假设后端地址是get.PHP，代码如下：
<?php
$a = $_GET['a'];
$b = $_GET['b'];
$c = $a + $b;
die($c);
this.$http.get('get.php',{a:1,b:2}).then(function(res){
alert(res.body);
},function(res){
console.log(res.status);
资源评论
- gis317#32021-02-17很水，不用下
weixin_38711643
- 粉丝: 1
- 资源: 902
会员权益专享
最新资源
- 零基础到精通保姆级Python教程
- 使用word邮件合并功能提取Excel表格中字段数据制作座位卡.pdf
- SCE 11.0x-WMM-Capture Weight-Serial Nbr-Data
- java实现邮件发送html
- 基于瞬时无功功率ip-iq的谐波信号检测MATLAB仿真
- 电池管理系统(BMS)的测试.pdf
- 微网冷热电联供系统最优经济运行研究（MATLAB程序）.zip
- 在matlab中通过yalmip平台调用cplex求解器，可用于求解MILP问题，适合于综合能源系统优化求解.zip
- yolov5预训练模型（yolov5l,yolov5m,yolov5s,yolov5x)
- 超市进销存管理系统(1).pdf
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
