Как использовать диспетчеризацию (response-redux) в классе Component

Question

Мой код

class LoginPage extends Component {

  render() {
    return (
        <div>
          <TextInput/>
          <br/>
          <TextInput/>
          <br/>
          <Button onClick={() => {
            const dispatcher = useDispatch();
            dispatcher(singIn())
          }}>SING IN</Button>
        </div>
    );
  }
}

Я предполагаю, что я использую хуки в компоненте класса, но что я могу использовать вместо useDispacth на мою страницу входа в систему?

Answer 1

Для компонентов класса вам нужно использовать метод connect из react-redux. Используйте метод connect и передайте функцию mapDispatchToProps, как показано ниже.

import { connect } from 'react-redux';
class LoginPage extends Component {

    render() {
        return (
            <div>
                <TextInput/>
                <br/>
                <TextInput/>
                <br/>
                <Button onClick={() => {
                    this.props.singIn()
                }}>SING IN</Button>
            </div>
        );
    }
}



const mapDispatchToProps = (dispatch) => {
    return {
        signIn: () => dispatch(signIn())
    }
};
export default connect(null, mapDispatchToProps)(LoginPage)

Прочтите через do c для получения дополнительной информации. https://react-redux.js.org/api/connect