class LoginPage extends Component {
render() {
return (
<div>
<TextInput/>
<br/>
<TextInput/>
<br/>
<Button onClick={() => {
const dispatcher = useDispatch();
dispatcher(singIn())
}}>SING IN</Button>
</div>
);
}
}
我想我在类组件中使用了一个钩子，但是我可以用什么来代替useDispacth我的 LoginPage？
对于类组件，您需要使用connect方法 from react-redux。使用连接方法和传递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)
通读文档以获取更多信息。 https://react-redux.js.org/api/connect