* fix: restructure certifications guide articles * fix: added 3 dashes line before prob expl * fix: added 3 dashes line before hints * fix: added 3 dashes line before solutions
49 lines
800 B
Markdown
49 lines
800 B
Markdown
---
|
|
title: Connect Redux to React
|
|
---
|
|
# Connect Redux to React
|
|
|
|
|
|
---
|
|
## Solutions
|
|
|
|
<details><summary>Solution 1 (Click to Show/Hide)</summary>
|
|
|
|
```jsx
|
|
const addMessage = (message) => {
|
|
return {
|
|
type: 'ADD',
|
|
message: message
|
|
}
|
|
};
|
|
|
|
const mapStateToProps = (state) => {
|
|
return {
|
|
messages: state
|
|
}
|
|
};
|
|
|
|
const mapDispatchToProps = (dispatch) => {
|
|
return {
|
|
submitNewMessage: (message) => {
|
|
dispatch(addMessage(message));
|
|
}
|
|
}
|
|
};
|
|
|
|
class Presentational extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
}
|
|
render() {
|
|
return <h3>This is a Presentational Component</h3>
|
|
}
|
|
};
|
|
|
|
const connect = ReactRedux.connect;
|
|
// change code below this line
|
|
|
|
const ConnectedComponent = connect(mapStateToProps, mapDispatchToProps) (Presentational)
|
|
```
|
|
</details>
|