Vue.js v型火焰两次改变事件

我存储了一个对象，并将其用作组件中的计算属性。在这里，我有一个输入为v-model='obj.name'的表单。我有一个方法来改变这个输入，那个就是分派动作，把这个obj发送到API，并在成功响应时调用变异来更新状态。问题是更改事件会触发两次

我更新了输入，更改激发的方法，我再次获得了成功的响应和更改激发的方法

这是我的意见：

    <v-text-field dense
      v-model="object.name"
      @change="submitForm"                                              
 ></v-text-field>

方法：

  methods:{
            submitForm(){
               {
                   return this.$store.dispatch('updateObject', this.object)
                        .then(() => {
                            alert('Data is saved')
                        })
                        .catch(error => {
                            alert(`Data is not saved. ${error}`)
                        })

            },
}

这是我的行动：

 updateObject(context, object){
            return axios
                .put(`/api/object/${context.state.objectId}`,  object)
                .then((response) => {
                    console.log(response)
                    context.commit('updateObject', order)
                })
                .catch(error => console.log(error))
        },

---

我得到了成功的警报，在我关闭它之后，更改事件再次被触发

我认为这是因为v-model是双向的，并且每当v-model值更改时@change就会触发。因此，当用户更新值时@change会触发一次，而第二次则会触发，因为该值是由vuex操作更新的

如何避免双重更新？这意味着我使用了不正确的方式来管理状态数据。您可以简单地包括一个按钮，当单击时调用submitMethod并删除@change触发器。

 updateObject(context, object){
            return axios
                .put(`/api/object/${context.state.objectId}`,  object)
                .then((response) => {
                    console.log(response)
                    context.commit('updateObject', order)
                })
                .catch(error => console.log(error))
        },