vue中的$http服务 需要引入一个叫vue-resource.js的文件，因为vue.js中没有$http服务。如果需要使用这个服务去百度下载vue-resource.js 然后引进项目即可。
还有一种方法是在开发项目中 需要，这样我们直接在npm 中下载 npm install vue-resource 即可 。然后在main.js中配置import VueResource from 'vue-resource'; 然后用Vue.use(VueResource) 方法启用插件。
第一种get方法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/vue.js"></script>
<script src="js/vue-resource.js"></script>
</head>
<body>
<div id="app">
<input type="button" value="点击获取" @click="get()"/>
</div>
<script>
new Vue({
el:"#app",
methods:{
get:function(){
this.$http.get('get.php',{
a:10,
b:1
}).then(function(res){
alert(res.data);
},function(res){
alert(res.status)
});
}
}
})
</script>
</body>
</html>
get.php文件：
<?php
$a=$_GET['a'];
$b=$_GET['b'];
echo $a-$b;
?>
get方法有两个参数get("PHP文件"，“参数”)
post方法：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/vue.js"></script>
<script src="js/vue-resource.js"></script>
</head>
<body>
<div id="app">
<input type="button" value="点击获取" @click="get()"/>
</div>
<script>
new Vue({
el:"#app",
methods:{
get:function(){
this.$http.post('post.php',{
a:2,
b:3
},{
emulateJSON:true
}).then(function(res){
alert(res.data);
},function(res){
alert(res.status)
});
}
}
})
</script>
</body>
</html>
<?php
$a=$_POST['a'];
$b=$_POST['b'];
echo $a+$b;
?>
post方法有三个参数post("php文件"，"参数","emulateJSON:true")
emulateJSON:true 模拟一个JSON数据发送到服务器，这样才可以成功运行
这样放在服务器环境下就可以运行了，我用的是phpstudy
扫一扫
3616
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
