Vue.js vuejs请求后自动刷新列表

我有一个向数据库添加新联系人的表单：

<el-form :model="contact" >
            <el-form-item>
              <el-input v-model="contact.firstname"/>
            </el-form-item>
         <el-form-item>
          <el-input v-model="contact.lastname"></el-input>
        </el-form-item>
          <el-button @click="submitForm">Save
          </el-button>
      </el-form>

当我提交表单时，我希望列表自动刷新：

 <div v-for="contact in arraycontacts">
    <div>{{ contact.firstname }}</div>
    <div>{{ contact.lastname }}</div>           
 </div>

{{contact.firstname}
{{contact.lastname}

---

我在互联网上看到过一些解决方案，但都使用axios或ajax，而我不是，我可以用什么方式来实现呢？

在提交处理程序中，从服务器获取响应并将其分配给联系人列表

methods: {
  async submitForm() {
  {
    this.getcontacts = await ContactApi().submit(this.contact);
    this.arraycontacts = this.getcontacts.contactsList; 
  }

methods: {
  async submitForm() {
  {
    this.getcontacts = await ContactApi().submit(this.contact);
    this.arraycontacts = this.getcontacts.contactsList; 
  }