如何从 Vuex/Vuejs 中的动作中调用另一个动作?

Posted

技术标签:

【中文标题】如何从 Vuex/Vuejs 中的动作中调用另一个动作?【英文标题】:How to call another action from actions in Vuex/Vues? 【发布时间】:2016-12-23 03:29:30 【问题描述】:

在删除其中一个站点后,我正在尝试更新 站点列表,方法是调用如下所示的 getSites() 方法

代码

import http from 'services/http.service';
import logging from 'services/logging.service';

const sites = http('sites', localStorage);

export default 
    getSites(dispatch) 
        console.log('getSites')
        sites.all().then((response) => 
            dispatch('setSites', response.data.results);
        );
    ,
    deleteSite(dispatch, site) 
        return sites.delete(site).then(() => 
            this.getSites()  // <-------- doesn't works
        );
    ,
;

我收到以下错误

删除失败 ReferenceError: getSites is not defined

问题

我应该如何调用获取我的新项目列表?或者我应该在我的组件then() 中执行它吗?

【问题讨论】:

有点晚了,但是用dispatch('getSites') 代替this.getSites() 不行吗? 【参考方案1】:

我从 actions.js 中删除了调用,并在我的组件方法中进行了调用:

import actions from 'vuex/actions';

export default
    // …
    methods: 
        // …
        delete_site(site)
            return this.deleteSite(site).then(response => 
                this.getSites();  // <----------- call from here
            );
        ,
    vuex: 
        actions: 
            getSites: actions.getSites,
            deleteSite: actions.deleteSite,
        
    

【讨论】:

以上是关于如何从 Vuex/Vuejs 中的动作中调用另一个动作?的主要内容,如果未能解决你的问题,请参考以下文章

EmberJS 动作 - 当包装在“动作”中时从另一个动作调用一个动作

无法通过getter vuex vuejs访问状态

如何从Angular中的另一个服务调用服务的特定实例?

如何重定向到同一控制器中的另一个动作?

Vuex + VueJS:未定义将计算属性传递给孩子

如何在 asp.net mvc 5 中返回模型和参数中的另一个动作?