其实步骤很简单,代码如下
<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>
打开界面,既可以看到,所需要的数据一家展示在前端的界面了