新人小白一只~请问起的列表没有显示出来是哪里的问题，我对照了老师的，还是发现不了，控制台说是contactList的api错误，，，我应该怎么解决啊？求帮助
<template>
<div class="home">
<!-- 联系人列表 -->
<van-contact-list :list="list" @add="onAdd" @edit="onEdit" />
<!-- showEdit是弹出层,默认隐藏 -->
<van-popup v-model="showEdit" position="bottom">
<van-contact-edit
:contact-info="editingContact"
:is-edit="isEdit"
@save="onSave"
@delete="onDelete"
/>
</van-popup>
</div>
</template>
<script>
// 引入
import { ContactList, ContactEdit, Toast, Popup } from "vant";
import axios from "axios";
export default {
name: "contactList",
// 注册
components: {
[ContactList.name]: ContactList,
// [Toast.name]: Toast,
[ContactEdit.name]: ContactEdit,
[Popup.name]: Popup
},
data() {
// {id: 1,name: "", tel: ""}
return {
list: [],
instance: null, //axios实例
showEdit: false, //编辑弹窗的显示隐藏
editingContact: {}, //正在编辑的联系人的数据
isEdit: false //新建或编辑
};
},
created() {
this.instance = axios.create({
baseURL: "http://localhost:9000/api",
timeout: 1000
});
this.getList();
},
methods: {
// 获取联系人列表
getList() {
this.instance
.get("/contactList")
.then(res => {
// console.log(res); 可以用console检查是否成功
this.list = res.data.data;
})
.catch(err => {
console.log(err);
Toast("请求失败，请稍后重试");
});
},
// 添加联系人
onAdd() {
this.showEdit = true;
this.isEdit = false;
},
// 编辑联系人
onEdit(info) {
this.showEdit = true; //展示弹窗
this.isEdit = true; //是否编辑
this.editingContact = info;
},
onSave(info) {
if (this.isEdit) {
//编辑保存
this.instance
.put("/contact/edit", info)
.then(res => {
if (res.data.code === 200) {
Toast("编辑成功");
this.showEdit = false;
this.getList();
}
})
.catch(() => {
Toast("请求失败，请稍后重试");
});
} else {
//新建保存
this.instance
.post("/contact/new/json", info)
.then(res => {
if (res.data.code === 200) {
Toast("新建成功");
this.showEdit = false;
this.getList();
}
})
.catch(() => {
Toast("请求失败，请稍后重试");
});
}
},
onDelete(info) {
this.instance
.delete("/contact", {
params: {
id: info.id
}
})
.then(res => {
if (res.data.code === 200) {
Toast("删除成功");
this.showEdit = false;
this.getList();
}
})
.catch(() => {
Toast("请求失败，请稍后重试");
});
}
}
};
</script>
<style scoped>
.van-contact-list__add {
z-index: 0;
}
.van-popup {
height: 100%;
}
</style>
