写了那么多,最终的数据都是要展示在前端的界面,才算是完成工作。
Element UI手册:https://cloud.tencent.com/developer/doc/1270
中文文档:http://element-cn.eleme.io/#/zh-CN
github地址:https://github.com/ElemeFE/element
其实步骤很简单,代码如下
<template>
<div id="app">
<div v-for="item in itemList">
<span>{{item.name}}</span>
<span>{{item.nick}}</span>
</div>
</div>
</template>
<script>
import axios from "axios";
export default {
name: "app",
data() {
return {
itemList: []
}
},
mounted() {
this.getData();
},
methods: {
getData() {
axios.get('http://localhost:8080/api/test').then(response => {
console.log(response.data);
this.itemList =response.data.first;
}, response => {
console.log("error");
});
}
}
}
</script>
打开界面,既可以看到,所需要的数据一家展示在前端的界面了
原文作者:祈澈姑娘
关注「编程微刊」公众号 ,在微信后台回复「小程序」,获取小程序开发全套资料和500G编程资源教程。