[英]Unable to retrieve the state from the store after redirection in Redux React JS
我正在使用React JS + Redux开发一个Web应用程序。 我是React的新手。 我现在正在做的是尝试在一个页面上设置状态,然后在重定向后在另一页面上检索状态。
我有一个名为EventListComponent的组件,用于显示事件列表。 在该组件内部,我更改了调用事件的reducer的状态。
这是我调用的reducer函数。
import * as EditEventActions from '../actions/edit.event.actions';
export default function (state = { }, action){
switch (action.type)
{
case EditEventActions.EVENT_SET_EDITING_EVENT:
return { ...state, event: action.payload }
default:
return state;
}
}
我先触发操作,然后再重定向到另一个这样的页面。
this.props.setEditingEvent(event);
this.props.history.push({
pathname : '/event/'+ event.id +'/edit'
});
在新页面中,我渲染名为EditEventComponent的组件。
这是EditEventComponent的定义
export class EditEventComponent extends React.Component{
constructor(props)
{
super(props);
alert(this.props.event.id)//cannot retrieve event here
}
render(){
return (
<h4>This is the Edit Event component</h4>
);
}
}
function mapStateToProps(state)
{
return {
event: state.editEvent.event
};
}
function matchDispatchToProps(dispatch)
{
return bindActionCreators({
}, dispatch);
}
const enhance = compose(withWidth(), withStyles(themeStyles, { withTheme: true }), connect(mapStateToProps, matchDispatchToProps))
export default enhance(EditEventComponent);
如您所见,在EditEventComponent内部,我试图检索上一页中设置的状态的事件字段。 但是我找不到它。 我的问题是
重定向到新页面后,(redux存储的)状态是否重置?
我的代码有什么问题?
如果我做的不是正确的方法,那么在React Redux中将对象从一页传递到另一页的最佳方法是什么?
这是我的行动
export const EVENT_SET_EDITING_EVENT = "(EVENT) SET EDITING EVENT";
export const setEditingEvent = (data) => ({
type: EVENT_SET_EDITING_EVENT,
payload: data
});
这是减速器
import * as EditEventActions from '../actions/edit.event.actions';
export default function (state = { }, action){
switch (action.type)
{
case EditEventActions.EVENT_SET_EDITING_EVENT:
return { ...state, event: action.payload }
default:
return state;
}
}
我也以这种方式公开EventListComponent。
const enhance = compose(withWidth(), withStyles(themeStyles, { withTheme: true }), connect(mapStateToProps, matchDispatchToProps))
export default enhance(EventListComponent);
您可能没有在setEditingEvent
操作中正确设置类型,并且reducer返回初始状态,因为它没有达到EVENT_SET_EDITING_EVENT
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.