vue 的ajax請求資料
阿新 • • 發佈：2019-02-04
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="demo">
<p>{{name}}</p>
</div>
</body>
<!--$http-->
<script src="js/vue.js"></script>
<script>
new Vue({
el:"#demo",
data:{
name:'yao'
},
methods:{
ajax:function(){
var self = this
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState==4&&xmlhttp.status==200){
var json = JSON.parse(xmlhttp.responseText);
console.log(json)
console.log(this)
self.name = json.name
}
};
xmlhttp.open('GET','test.php',true);
xmlhttp.send()
}
},
ready:function(){
this.ajax()
}
})
</script>
</html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="demo">
<p>{{name}}</p>
</div>
</body>
<!--$http-->
<script src="js/vue.js"></script>
<script>
new Vue({
el:"#demo",
data:{
name:'yao'
},
methods:{
ajax:function(){
var self = this
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
if(xmlhttp.readyState==4&&xmlhttp.status==200){
var json = JSON.parse(xmlhttp.responseText);
console.log(json)
console.log(this)
self.name = json.name
}
};
xmlhttp.open('GET','test.php',true);
xmlhttp.send()
}
},
ready:function(){
this.ajax()
}
})
</script>
</html>