использование mapDispatchToProps в компоненте реакции

Question

У меня проблема в том, что я не могу найти способ вставить mapDispatchToProps в мой реактивный компонент. так как это класс.

Это класс, в котором у меня проблема, я получаю сообщение об ошибке: «findPosts» не определено.

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);

В других компонентах я смог сделать это, потому что я мог использовать что-то вроде этого:

const mapDispatchToProps = {
  getPosts: fetchPosts
};

const Reactions = ({ getPosts}) => (
<LinkButton onClick={() => {getPosts("messages");}}>
  Back to posts
</LinkButton>
);

export default connect(null, mapDispatchToProps)(Reactions);

Но так как мне нужен бит this.setState в коде, я не могу изменить его, как во втором примере.

Answer 1

В классе вы должны использовать this.props.findPosts(this.state.value)