My code
class LoginPage extends Component {
render() {
return (
<div>
<TextInput/>
<br/>
<TextInput/>
<br/>
<Button onClick={() => {
const dispatcher = useDispatch();
dispatcher(singIn())
}}>SING IN</Button>
</div>
);
}
}
我想我在类组件中使用了钩子,但是我可以用什么来代替useDispacth
到我的登录页面?
对于类组件,您需要使用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)
阅读文档以获取更多信息。https://react-redux.js.org/api/connect https://react-redux.js.org/api/connect
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)