Question

我正在寻找一种方法，一旦我知道已分派多个动作，就可以分派一个动作。我知道我现在可以通过在存储区中存储一些变量来做到这一点。但是有没有更好的方法（Saga，Discoverables）等。我试图浏览他们的文档，但不知道是否可以将其用于此目的。

例如，在下面的代码中，当我知道已经调度了2个必需的操作时，我想在中间件中调度一些动作

import React, { Component } from 'react';
import ReactDOM from 'react-dom'
import {createStore, applyMiddleware} from 'redux'
import {Provider} from 'react-redux'

const dummyReducer = (state=null,action) => {
    return state
}

const defaultAction1 = { type: 'DEFAULT_ACTION1'}
const requiredAction1 = { type: 'REQUIRED_ACTION1'}
const requiredAction2 = { type: 'REQUIRED_ACTION2'}

const middle = (store) => (next) => (action) => {
    if(action.type === 'REQUIRED_ACTION1')
        console.log('Required actions satisfied')
    next(action)
}

const store = createStore(dummyReducer, applyMiddleware(middle))

store.dispatch(defaultAction1)

//Dispatch an action after 2 secs
setTimeout(store.dispatch.bind(null,requiredAction1),2000)
setTimeout(store.dispatch.bind(null,requiredAction2),4000)

class DummyComponent extends Component{
    render(){
        return(<h1> nothing to see here </h1>)
    }
}

ReactDOM.render(<Provider store={store}> 
                    <DummyComponent />
                </Provider>, 
                document.getElementById('root')
);

Answer 1

您可以通过以下方式轻松地完成此任务：

yield all([
  take(REQUIRED_ACTION1),
  take(REQUIRED_ACTION2),
])
yield put({type: FINAL_ACTION})

Answer 2

动作必须是不言自明且完整的，这是一种在其有效负载中分派所有必要信息的动作的好习惯。

您应始终尝试的另一个原因是根据目的分配不同的操作，并利用Redux工具适当地调试应用程序。 Redux同步更新状态，这实际上是其设计的优势。就是说，您知道当一项操作通过所有化简器时，您将具有适当的状态以反映UI部件上的更改。

如果您依靠两个动作，那么您在某种程度上就不能依靠真理的单一来源，即您的action1和action2。这迫使您在中间件中等待这两种情况，并将您的操作转换为效果，并且效果在不同的上下文中使用。

如何等待2个动作调度另一个动作

2 个答案: