Question

我正在使用React / Redux / Thunk / React路由器应用程序，每次组件渲染时，状态似乎意外地恢复到每个reducer的默认状态。

例如：

我浏览到主页路由，呈现主页组件，并且状态设置正确 - 新状态在loggerMiddleware的输出中按预期显示，应用程序按预期工作。

然而，当我然后浏览到另一个路由并渲染一个EventPage组件时，就好像状态为空/默认 - mapStateToProps中的state参数只是一个空对象列表，就像我看到的那样combinereducers的默认输出。我在loggerMiddleware输出中看到了同样的事情。同样，当我浏览回主页组件时，状态再次为空/默认。

我的期望是状态将保持在页面视图/组件渲染之间。这是对的吗？

有关应用程序的一些摘录，以防它有助于识别我正在犯的任何错误 - 很高兴提供更多：

Eventpage和Homepage组件/容器的底部：

export default connect(mapStateToProps, mapDispatchToProps)(HomePage);

export default connect(mapStateToProps, mapDispatchToProps)(EventPage);

index.js

中定义的路由器

ReactDOM.render(
    <Provider store={store}>
        <Router history={browserHistory}  >
            <Route path="/" component={HomePage}/>
        <Route path="EventsSimpleList" component={EventsSimpleList}/>
            <Route path="events/:eventId" component={EventPage}/>
        </Router>
    </Provider>
  , document.querySelector('#root'));

我的rootReducer定义：

const rootReducer = combineReducers({
  EventsToAssets: EventsToAssetsReducer,
  Assets: AssetsReducer,
  Events: EventsReducer,
  Venues: VenuesReducer,
  Artists: ArtistsReducer,
  Homepage: HomepageReducer
});

export default rootReducer;

Answer 1

我已经通过将<a>元素替换为从react-router导入的<Link>元素来解决问题。这不能解决用户手动将新URL输入其地址栏的问题，但在链接的情况下确实解决了问题。我相信这实际上是预期的行为。如果我弄错的话，我相信有人会纠正我。

每次组件呈现时，状态似乎都会恢复为默认值

1 个答案: