1、axios的作用
axios是独立于vue的一个项目,可以用于浏览器和node.js中发送ajax请求
2、axios实例
2.1复制js资源
vue.min.js
axios.min.js
2.2创建 axios.html
2.3引入js
<script src="vue.min.js"></script>
<script src="axios.min.js"></script>
2.4编写js
<div id="app">
<table>
<tr v-for="user in userList">
<td>{{user.name}}</td>
<td>{{user.age}}</td>
</tr>
</table>
</div>
<script src="vue.min.js"></script>
<script src="axios.min.js"></script>
<script>
new Vue({
el: '#app',
data: {
userList:[]
},
created() { //在页面渲染之前执行
//调用方法,得到返回json数据
this.getList()
},
methods:{
getList() {
//使用axios方式ajax请求
axios.get("user.json")
.then(response => {//请求成功
//console.log(response)
this.userList = response.data.data.items
console.log(this.userList)
})
.catch(error => {
console.log(error)
}) //请求失败
}
}
})
</script>