React Redux组合减速器

Question

In Redux, if I am using say a data structure as follows:

{ 
    products: [ 
                {id:1, name:'tv', description:'A color Sony TV', cost:1000}, 
                {id:2, name:'remote control', description:'A black compact Remote Control', cost: 999}
    ],
    shoppingCart: [],
    checkoutCart: []
}

And I use the Redux combineReducers

combineReducers({products, shoppingCart, checkoutCart})

If I wanted to copy the shopping Cart data into the checkoutCart say on a click event, where would I do so / or should I do so ?

Answer 1

When you use combineReducers you're assuming the reducers are indepedent and they cannot see each other's state. Each reducer will only receive a "slice" of the state.

In order to achieve what you want, I would consider joining the shoppingCart and checkoutCart reducers / state into a single one and using switch (action.type) to know what to do.

Now you can simply create an action on your new reducer that returns something like

{ checkoutCart: clone(state.shoppingCart) }

Answer 2

I would use an action and send the whole shopping cart data as payload

If it is difficult to pass the data of the shopping cart in the component you could access the state in the action creator as described here https://stackoverflow.com/a/35674575/1868008 but you need to use redux-thunk

Answer 3

If you want to clone your shoppingCart to the checkoutCart . You could in your onClick function pass this.props.shoppingCart as a parameter to your action call.

onClick(e) {
    this.props.checkOutActions.checkOut(this.props.shoppingCart);
}