Alt 通量操作：即使调用 this.generateActions，_this.actions 也未定义答案

【问题标题】：Alt flux action: _this.actions is undefined even when this.generateActions is calledAlt 通量操作：即使调用 this.generateActions，_this.actions 也未定义
【发布时间】：2016-08-08 08:30:35
【问题描述】：

我在我的 React/Flux 项目中使用 Alt 库来表示 Flux 部分，并且我得到了动作创建者。

我创建了以下操作：

// alt.js
import Alt from 'alt';

export default new Alt();

// UserActions.js
import alt from '../alt';

class UserActions {
    constructor() {
        this.generateActions(
            'getUsersSuccess',
            'getUsersFailed'
        );
    }

    getUsers(userId) {
        $.ajax({ url: '/api/users/'+userId })
        .done((data) => {
            this.actions.getUsersSuccess(data);
        })
        .fail((jqXhr) => {
            this.actions.getUsersFailed(jqXhr);
        });
    }
}

export default alt.createActions(UserActions);

问题是动作，this.actions，是未定义的。我是否理解正确，this.generateActions 函数应该填充 UserActions 类的 actions 属性，还是我需要编写其他内容才能使操作可用？

我相信，使用 ES6，匿名函数中的 this 应该正确地绑定到 UserActions 类的 this。

【问题讨论】：

标签： javascript ecmascript-6 reactjs-flux

【解决方案1】：

我不知道 Alt 的实现最近是否发生了变化，但我必须手动使用 dispatch 编写动作代码，以使其正常工作，并直接调用这些函数，而不是尝试使用 @987654321 访问它们@属性。

这是我得到的代码，它可以成功加载以存储和映射动作应该被映射的方式。

import alt from '../alt';

class UserActions{
    getUsers(userId) {
        $.ajax({url: 'api/users/'+userId})
            .done((data) => {
                this.getUsersSuccess(data);
            })
            .fail((jqHxr) => {
                this.getUsersFail(jqHxr);
            });
        return false;
    }

    getUsersSuccess(data) {
        return (dispatch) => {
            dispatch(data);
        }
    }

    getUsersFail(jqHxr) {
        return (dispatch) => {
            dispatch(jqHxr);
        }
    }
}

export default alt.createActions(UserActions);

使用这种方法，构造函数中的generateActions 调用不仅没有必要，而且需要避免，否则使用该动作创建器的商店将不知道您要使用哪个动作。

我还在 getUsers 函数的末尾添加了 return false 以抑制 alt 引发的控制台警告（函数未调度时必须返回 false）。

此处调度的操作，getUsersSuccess 和 getUsersFail，应该在存储中具有消耗参数并影响状态的对应物。

【讨论】：

感谢分享您的解决方案，我遇到了同样的问题

【解决方案2】：

没有必要再使用action了，试试吧：

// alt.js
import Alt from 'alt';
export default new Alt();

// UserActions.js
import alt from '../alt';

class UserActions {
    constructor() {
        this.generateActions(
            'getUsersSuccess','getUsersFailed'
        );
    }

    getUsers(userId) {
        $.ajax({ url: '/api/users/'+userId })
        .done((data) => {
            this.getUsersSuccess(data);
        })
        .fail((jqXhr) => {
            this.getUsersFailed(jqXhr);
        });
    }
}
export default alt.createActions(UserActions);

【讨论】：