using mapDispatchToProps in react component - reactjs

Question

I have the problem that i cannot find a way to get the mapDispatchToProps into my react component. since it is a class.
This is the class where i have the problem, i get the error: 'findPosts' is not defined.
const mapDispatchToProps = {
findPosts: searchPosts
};
class SearchMenu extends React.Component {
state = {
anchorEl: null,
value: ''
};
handleChange = event => {
this.setState({value: event.target.value,});
};
handleClick = event => {
this.setState({ anchorEl: event.currentTarget });
};
handleClose = () => {
this.setState({ anchorEl: null });
};
render() {
const { anchorEl } = this.state;
return (
<Fragment>
<IconButton onClick={this.handleClick}>
<SearchIcon color="secondary" />
</IconButton>
<Menu
anchorEl={anchorEl}
open={Boolean(anchorEl)}
onClose={this.handleClose}
>
<MenuItem>
<CategorySelector />
</MenuItem>
<MenuItem>
<TextField
value={this.state.value}
onChange={this.handleChange}
/>
<IconButton onClick={() => { findPosts(this.state.value); }}>
<SearchIcon color="secondary" />
</IconButton>
</MenuItem>
</Menu>
</Fragment>
);
}
}
export default connect(null,mapDispatchToProps)(SearchMenu);
In other components I was able to do this because I could use something like this:
const mapDispatchToProps = {
getPosts: fetchPosts
};
const Reactions = ({ getPosts}) => (
<LinkButton onClick={() => {getPosts("messages");}}>
Back to posts
</LinkButton>
);
export default connect(null, mapDispatchToProps)(Reactions);
But because I need the this.setState in the bit of code, I am not able to change it like in the second example.

Answer 1

In class you have to use this.props.findPosts(this.state.value)