CODEWITHSUNDEEP
reactjsreduxreact-redux
Kiran Dash
Kiran Dash

Reputation: 4956

How to map Multiple dispatch actions to single prop in React Redux

I need to dispatch two actions when submit button is pressed.

const mapDispatchToProps = dispatch => ({
    onSubmitPressed: countryCode => dispatch(createCountry(countryCode)),
    onSubmitPressed: countryCode => dispatch(loadCountry(countryCode)),
});

The above code works but gives a warning

Duplicate key 'onSubmitPressed'

How to modify the code to map both dispatch actions to single prop without duplicating the key.

Upvotes: 1

Views: 284

Answers (3)

Ignacio Elias
Ignacio Elias

Reputation: 578

I'm definitely not sure about this, but it probably works

const mapDispatchToProps = dispatch => ({
    onSubmitPressed: countryCode => {
        dispatch(createCountry(countryCode));
        dispatch(loadCountry(countryCode));
    }
});

Upvotes: 0

Carlos Saiz Orteu
Carlos Saiz Orteu

Reputation: 1805

I don't think this is the best way to do this but if you need it that way I think that might do the trick:

const mapDispatchToProps = dispatch => ({
    onSubmitPressed: (countryCode) => {
        dispatch(createCountry(countryCode));
       dispatch(loadCountry(countryCode));
    }
});

Upvotes: 0

Nicholas Tower
Nicholas Tower

Reputation: 85112

const mapDispatchToProps = dispatch => ({
    onSubmitPressed: countryCode => {
      dispatch(createCountry(countryCode));
      dispatch(loadCountry(countryCode));
    }
});

Upvotes: 1

Related Questions