<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>axios</title> </head> <script type="text/javascript" src="js/vue.js" ></script> <script type="text/javascript" src="js/axios.min.js" ></script> <script type="text/javascript" src="js/vue-resource.min.js" ></script> <script> window.onload = function(){ //配置是否允许检查代码,方便调试,生产环境中设置为false Vue.config.devtools = true; //检查代码 Vue.config.productioinTip = false; //有强迫症的,可以关掉生产中的提示信息 new Vue({ el:'#div1', data:{ user:{ name: 'lili', age:20 } }, methods:{ send(){ axios({ method:'get', url:'user.json' }).then(function(res){ console.log(res.data); }).catch(function(msg){ console.log(msg.status); }); }, getSend(){ axios.get('user.php',{ params:{ name: '李四', age: 19 } }).then(res => { console.log(res.data); }).catch(err => { console.log('get请求失败:'+err.status+','+err.statusText); }) }, postSend(){ axios.post('server.php',this.user,{ transformRequest:[ function(data){ let params = ''; for(let index in data){ params += index+'='+data[index]+'&'; } return params; } ] }).then(resp => { console.log(resp.data); }).catch(err => { console.log('请求失败:'+err.status+','+err.statusText); }) }, jsonpSend(){ this.$http.jsonp('https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su',{ params:{ wd:'a' //百度的参数 }, jsonp: 'cb',//可以修改对方请求参数名称 }).then(res => { console.log(res.data); }) } } }) } </script> <body> <div id="div1"> <button @click="send">axios请求</button> <button @click="getSend">get请求</button> <button @click="postSend">post请求</button> <button @click="jsonpSend">jsonp请求</button> </div> </body> </html>
<?php $name = $_GET['name']; $age = $_GET['age']; $msg = '用户名:'.$name.',年龄:'.$age; echo $msg;
<?php $name = $_POST['name']; $age = $_POST['age']; $msg = '用户名:'.$name.',年龄:'.$age; echo $msg;