Reza Shoja
Reza Shoja

Reputation: 927

is that Ok to call multiple actions at the same time?

I have multiple reducers and I need to send separate actions for each of them on a click so this is what I did:

<TouchableOpacity
    style={[styles.button, styles.edit]}
    onPress={()=>{
       this.props.toggleCurrentTask(this.props.task);
       this.props.triggerUpdating(id);
    }}
>
   <Text>Edit</Text>
</TouchableOpacity>

but the toggleCurrentTask action didn't work and I was struggling for a while, at the end just replacing them solved my problem! like this:

onPress={()=>{
   this.props.triggerUpdating(id);
   this.props.toggleCurrentTask(this.props.task);
}}

So I thought maybe calling two actions at the same time is a bad practice. If that's the case, what should I do instead?

Upvotes: 0

Views: 826

Answers (1)

Scarysize
Scarysize

Reputation: 4281

This is fine, but you can also have different reducers react to the same action (type): In your example the reducer storing the updating state could change its state when a toggleCurrentTask action is dispatched:

const TOGGLE_CURRENT_TASK = 'task/TOGGLE_CURRENT_TASK';

/* update reducer */

const updatingState = {
    isUpdating: false
}

const updatingReducer = (state = updatingState, action) => {
    switch (action.type) {
        case TOGGLE_CURRENT_TASK:
            return {
                ...state,
                isUpdating: true
            }
    }
}

/* task reducer */
const taskState = {}

const taskReducer = (state = taskState, action) => {
    switch(action.type) {
        case TOGGLE_CURRENT_TASK:
            return {
                ...state,
                activeTasks: action.task
            }
    }
}

IMO this keeps your React component cleaner and scales better, imagine your have to dispatch five different actions in the event handler instead of just two.

Upvotes: 2

Related Questions