如何在 VueJS 的 SetTimeOut 中提交存储

Posted 2023-02-22

【中文标题】如何在 VueJS 的 SetTimeOut 中提交存储

【英文标题】：How to commit to store within a SetTimeOut in VueJS

【发布时间】：2019-12-20 10:19:49

【问题描述】：

我正在使用 Vue.js 在 Laravel 中制作应用程序。我想在触发方法时等待两秒钟，然后执行存储操作。但是，当我实现它时，我收到一个错误。

这是我的代码：

.listen('TeamLeaving', e => 
  setTimeout(function() 
    axios.get('/api/team/' + e.team.id + '/pulse').then(response => 
      if (response.data === 0) 
        // here is where it messes up
        this.$store.commit('team/REMOVE_TEAM', e.team)
      
    )
  , 2000)

  // this.$store.commit('team/REMOVE_TEAM', e.team);
)

但是我得到一个错误：

Uncaught (in promise) TypeError: Cannot read property 'commit' of undefined

当我在setTimeout 之外进行提交时，它工作得很好。所以我假设setTimeout 内部存在问题。有人可以帮我解决这个问题吗？

【参考方案1】：

这篇文章可能对你有所帮助：how to set timeout in a vueJs method

重要的一点：

匿名函数中的this 附加到该匿名函数 不是你的主要功能

你可以试试这个：

.listen('TeamLeaving', (e) => 
                    let vm = this;
                    setTimeout(function () 
                        axios.get('/api/team/'+ e.team.id + '/pulse')
                            .then(response => 

                                if (response.data === 0) 
                                    //here is where it messes up
                                    vm.$store.commit('team/REMOVE_TEAM', e.team)
                                
                            );


                    , 2000);

                    // this.$store.commit('team/REMOVE_TEAM', e.team);

                );