React Problem with multiple export in Class Component

Question

Previously in my Class Component redux connect used to look something like this. This worked without any issues.

//File: MyComponent.jsx
    //in below code this.props.selectProducts is not undefined and this works fine
        const mapStateToProps = null;
        const mapActionsToProps = {
            selectProducts
        };
        
        export default connect(
            mapStateToProps,
            mapActionsToProps
        )(MyComponent);

After this I had to use this component called notistack to display the snackbar and I exported this as default instead of the existing redux connect. Now I am facing a issue where the props doesn't exist.

const mapStateToProps = null;
const mapActionsToProps = {
    selectProducts
};

//Now this.props.selectProducts is undefined which is part of redux store
//But this.props.enqueueSnackbar("Preference saved."); this works. which is part of withSnackbar
export const ConnectedList = connect(
    mapStateToProps,
    mapActionsToProps
)(MyComponent);
export default withSnackbar(MyComponent);

If i make the redux connect as default I am unable to access this.props.enqueueSnackbar(). Any help would be much appreciated. Thanks

cbr · Accepted Answer · 2020-08-26 18:31:15Z

2

Just use withSnackbar on the component returned by connect and use that:

const ConnectedList = connect(
    mapStateToProps,
    mapActionsToProps
)(MyComponent);
export default withSnackbar(ConnectedList);

answered Aug 26, 2020 at 18:31

cbr

13.8k3 gold badges43 silver badges69 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

AnonymousCoder Over a year ago

Wow!! Thanks never knew we could do that. I couldn't find the info or may be i didn't know exactly what to search for.

Collectives™ on Stack Overflow

React Problem with multiple export in Class Component

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related