vue.js数据请求并显示

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue 测试实例 - 菜鸟教程(runoob.com)</title>
<script src="https://cdn.staticfile.org/vue/2.4.2/vue.min.js"></script>
<script src="https://cdn.staticfile.org/vue-resource/1.5.1/vue-resource.min.js"></script>
</head>
<body>
 <div id="list">{
    
    {
    
    gridData}}</div>
<script type = "text/javascript">
window.onload = function(){
    
    
	 var vm = new Vue({
    
    
	       el:"#list",
	       data:{
    
    
	         gridData: "",
	       },
	       mounted: function() {
    
    
	         //发送 post 请求
	         	this.$http.post('https://v1.alapi.cn/api/qinghua').then(function(res){
    
    
	         	    console.log(res.data.data.content); 
	         		this.gridData=res.data.data.content
	         	},function(res){
    
    
	         	    console.log(res.status);					
	         	});
	         }	     
	   
	     }); 
		 }
</script>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_43101671/article/details/106406736