axios+vue实现动态渲染员工数据+数据是对象

 <style>table{width: 600px;margin: 0 auto;text-align: center;border-collapse: collapse;  /*合并边框哦*/}tr th,tr td{border: 1px solid pink;}</style><script src="../vue.js"></script><script src="../axios.js"></script>

<div id="app"><table><thead><tr><th>姓名</th> <th>年龄</th> <th>性别</th>  <th>工作</th></tr></thead><tbody><tr v-for="item in users"><td>{{item.name}}</td><td>{{item.age}}</td><td>{{item.sex}}</td><td>{{item.job}}</td></tr></tbody></table>
</div>

<script>var vm=new Vue({el:"#app",data:{users:[]}});axios.get("./server.json").then(function (response) {console.log(response.data);//返回的是一个数组vm.users=response.data;}).catch(function (err) {console.log(err)})
</script>

　　

//server.json文件内容{"users": [{"name":"张三", "age": 18, "sex": "男", "job":"web开发"},{"name":"李四", "age": 19, "sex": "女", "job":"UI设计"},{"name":"王五", "age": 20, "sex": "男", "job":"java开发"},{"name":"赵六", "age": 21, "sex": "女", "job":"php开发"}]
}