Flux / Flummox：组件在第一次路由器转换后停止侦听Store

Question

我刚刚开始使用flummox而且我有点沮丧：）

这是我的用例。

应用布局

<section id="layout">
  <Header {...this.props} />
  <RouteHandler {...this.props} />
  <Footer />
  <Alert {...this.props} />
</section>

在我的应用中，我有Alert Component。当某些事情发生时，我会从某个组件触发AlertAction，它会将警报有效负载发送到AlertStore，然后更新，AlertComponent显示警报（+在一段时间后隐藏它）。

例如我有PostEdit Component。表单提交后，我从PostActions向API发送请求并收到响应，该响应将发送到PostStore。商店已更新，PostEdit Component会收到通知。在PostEdit＆＃39; componentWillReceiveProps我检查商店收到的道具，并触发AlertAction以显示提醒。

2个问题：

1. 我必须使用setTimeout从AlertAction触发Post Component以发生警报事件（下面的代码）。
2. 主要问题是Alert Component在第一次AlertStore转换后停止了react-router。

这是console.log，说明了问题：



另一个奇怪的事情是在dispatch-payload-from-action-notification之前打印的console.log中的更改存储通知（导致此存储更改）。

以下是代码段：

AlertHandler.jsx

export default class AlertHandler extends React.Component {

  // constructor()

  render() {
    return (
        <FluxComponent connectToStores={'alerts'}>
          <Alert {...this.props} />
        </FluxComponent>
    );
  }
}

Alert.jsx

export default class Alert extends React.Component {

  // constructor()
  // _handleShow()
  // _handleHide()

  componentDidMount() {
    this.props.flux.getStore('alerts').addListener('change', function() {
      console.log('Changed!', this.state);
    });
  }

  componentWillUnmount() {
    console.log('Not gonna happen');
  }

  // render()
}

PostEdit.jsx

export default class PostEdit extends React.Component {

  // constructor()

  componentWillReceiveProps(newProps) {
    this.setState({
      isLoading: false
    }, () => {
      if (newProps.errors) {
        // without `setTimeout` nothing happens
        setTimeout(() => {
          newProps.flux
              .getActions('alerts')
              .showErrorAlert(newProps.errors);
        }, 1);
      } else {
        setTimeout(() => {
          newProps.flux
              .getActions('alerts')
              .showSuccessAlert();
        }, 1);
      }
    });
  }

  _submitPost(e) {

    // doing stuff...

    // triggering updatePost action
    this.props.flux
        .getActions('posts')
        .updatePost(post);
  }

  // render()
}

不确定是这些错误还是我错过了流量/ flummox模式中的smth并且做错了。感谢您的反馈！