新人小白一只~请问起的列表没有显示出来是哪里的问题，我对照了老师的，还是发现不了，控制台说是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>