当我使用Redux搜索在React组件中使用切换状态时,我就进入了此页面,但在这里我找不到使用相同状态的任何方法。
因此,我认为这可能会帮助那些努力使用Redux实现切换状态的人。
我的减速器文件在这里。默认情况下,我将初始状态设置为false。
const INITIAL_STATE = { popup: false };
export default (state = INITIAL_STATE, action) => {
switch (action.type) {
case "POPUP":
return {
...state,
popup: action.value
};
default:
return state;
}
return state;
};
单击图像时更改状态。因此,我的img标签带有onClick函数。
<img onClick={togglePopup} src={props.currentUser.image} className="avatar-image avatar-image--icon" />
我的Toggle Popup函数位于下面,该函数称为Dispatcher。
const togglePopup = ev => {
ev.preventDefault();
props.handlePopup(!props.popup);
};
该调用转到mapDispatchToProps函数下面,该函数反映回切换状态。
const mapDispatchToProps = dispatch => ({
handlePopup: value => dispatch({ type: "POPUP", value })
});
谢谢。
this.state.check
在this.setState({check: !check.value})
。并添加已选中复选框的属性,该属性会根据组件状态而变化。checked={this.state.checked}