javascript - 回流商店处于一种不听 Action 的情况

标签 javascript reactjs refluxjs

我有一个 Reflux 商店正在监听“customerLoaded”操作。此操作向商店提供客户详细信息。当商店收到新的或更新的客户信息时,会触发它以通知监听组件新的或更新的客户详细信息。

(所有代码已从荷兰语翻译成英语,因此可能有一两个拼写错误)

var CustomerStore = Reflux.createStore({
init: function ()
{
    this.listenTo(CustomerActions.customerLoaded, this._onCustomerLoaded);
},
// handlers
_onCustomerLoaded: function (data)
{
    if (data)
    {
        _customers[data.Number] = data;
        this.trigger(data.Number);
    }
},
getCustomer: function(number)
{
  var customer = null;
  if(_customers[number])
  {
    customer = _customers[number];
  }
  else
  {
    CustomerActions.loadCustomer(number);
  }
  return customer;
}
});

我有我的反流 Action 。

var CustomerActions = Reflux.createActions(
[
  "loadCustomer",
  "customerLoaded",
  "setEmail",
]
);

CustomerActions.loadCustomer.preEmit = function (number)
{
    if (!number|| number=== 0 || number=== '')
    {
        CustomerActions.customerLoaded(null);
    }
    else
    {
      // request details from server
      CustomerApi.getCustomerByNumber(number)
        .done(function (data)
          {
              // send details to the store
              CustomerActions.customerLoaded(data);
           }
        );
    }
};

CustomerActions.setEmail.preEmit = function (number, newValue)
{
  if(number && number !== 0 && number !== '')
  {
    // send updated email address to server
    CustomerApi.setEmail(number, newValue)
      .done(function (result)
      {
        if(result)
        {
          // start action to load customer details from the server
          CustomerActions.loadCustomer(number);
        }
        // else.. TODO: ...
      });
      }
    };

使用 setEmail 操作时会出现此问题。事实上,此操作正常工作,并且电子邮件地址已在服务器上更新。即使触发了从服务器重新加载客户详细信息的操作,但在 loadCustomer.preEmit 中,触发“CustomerActions.customerLoaded(data)”操作时什么也没有发生。 CustomerStore 不会响应此操作。 “data”参数包含预期的数据,因此这不是问题。

最奇怪的是,为了最初在屏幕上显示客户详细信息,使用了 CustomerActions.loadCustomer 和 CustomerStore 的相同组合,没有任何问题。当我用它来显示不同客户的详细信息时,这种组合仍然有效。

有谁知道可能出现的问题,或者我可以采取什么措施来检查商店为何不响应该操作?

提前致谢!

最佳答案

尝试使用示例异步工作流程而不是使用 preEmit 钩子(Hook)重写代码。如果您需要验证,我认为您应该使用 shouldEmit Hook 而不是 preEmit。但首先尝试完全不使用钩子(Hook)。 https://github.com/spoike/refluxjs#asynchronous-actions

也许这会有所帮助。

关于javascript - 回流商店处于一种不听 Action 的情况,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29841570/

相关文章:

javascript - 获取 JSON 对象中的所有路径

javascript - 如何通过对象 ID 访问其他属性值?

javascript - 无法在现有状态转换期间更新(例如在 `render` 内)

javascript - react JS : Map over an array of objects to render in JSX

reactjs - Uncaught ReferenceError : translate is not defined

jasmine - 如何使用 Jest 测试回流 Action

javascript - 如何完成清洁横幅

javascript - ReactJs 上的无限循环渲染组件

javascript - 从一个 Action 函数清除 React Reflux 中多个 Store 的数据

reactjs - 如何使用 react-create-app 获取代码覆盖率报告?