简单的ajax请求和v-for遍历
1.在test.js中定义url对象并向外暴露
var testUrl= {
url:"http://47.94.19.145/to/schoolcanteen/list"
}
export default testUrl
2.在vue文件中引入
import axios from "axios"
import testUrl from "@/common/api/test"
3.定义info
data: () => ({
info: {},
}),
4.在生命周期函数中定义url 并发送请求
mounted() {
const vm = this;
let url =testUrl.url;
let prams = "?schoolId=1";
axios
.get(url + prams).then(function (res) {
vm.info = res;
})
}
或者写成
vm.axios.get(url + params).then((response) => {
vm.info = res
}
5.在页面中遍历获取
<div v-for="(shops, index) in info">
<img :src="shops.imagePath"/>
</div>