CODEWITHSUNDEEP
javascriptreactjsredux
vuvu
vuvu

Reputation: 5328

How to use redux-connect with reactjs and js-classes?

I want to refactor react code that made use of 'React.createClass' and replace with JavaScript Classes. How can I combine the Classes synthax with connect and redux? How would the code be written with JavaScript classes?

import {connect} from 'react-redux';
const UserOverview= React.createClass({

 ...

});

const mapStateToProps = (state) => {
  return {selectedUser: state.project.selectedUser};
}    ;

export default connect(mapStateToProps, null)(UserOverview);

Upvotes: 1

Views: 278

Answers (1)

Tyler Sebastian
Tyler Sebastian

Reputation: 9458

It's more or less the same - your Object properties just become class methods/properties.

class UserOverview extends React.Component {
    // methods, etc - remember to watch out for scoping, especially in callbacks

    onDivClick = () => {
        // either use ES6 style "arrow functions" (like this)
        // or rebind your callback handlers inside of `constructor`
    }

    render() {
        return <div onClick={this.onDivClick}/>;
    }
}

export default connect(mapStateToProps, {})(UserOverView);

Upvotes: 3

Related Questions