2016-07-30 3 views
0

私はReact/Redux/Thunk/React Routerアプリケーションで作業していますが、コンポーネントがレンダリングされるたびに状態が予期せずデフォルト状態に戻ります。例えばコンポーネントがレンダリングするたびに状態がデフォルトに戻っているようです

私はホームページのコンポーネントをレンダリングし、ホームページのルートを参照し、状態が正しく設定されている - loggerMiddlewareからの出力で期待どおりに新しい状態が表示され、期待通りにアプリケーションが動作します。

しかし、別のルートを参照してEventPageコンポーネントをレンダリングすると、状態は空/デフォルトと同じになります。mapStateToPropsのstate引数は、単に空のオブジェクトのリストです。既定の出力が見えますコンビネーションから。私はloggerMiddlewareの出力で同じことを見る。同様に、私がホームページコンポーネントを参照すると、stateは再び空/デフォルトになります。

私の予想は、ページビュー/コンポーネントレンダリングの間に状態が残るということです。あれは正しいですか?

問題のアプリケーションの一部抜粋、それは私が作ってるんだ間違い特定するのに役立ちます場合には - だけでなく、よりを提供するためにハッピーを:

Eventpageやホームページコンポーネント/コンテナの下:

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; 
+2

あなたの期待は正しいです、我々はより多くのコードを見る必要があるでしょう。たぶん、あなたは 'createStore'を複数回呼び出すでしょうか?またはReactDom.renderを複数回使用することはできますか?減速機の状態を変更する可能性がありますか? – azium

+0

@azium、http://stackoverflow.com/a/34813184/479891で「別の2つのhttpリクエストの間にストアを保存する方法はありません」という別の質問に対する回答が見つかりました。私が正しく理解していれば、これは "状態がページビュー/コンポーネントレンダリングの間に残る"という私の期待が正しいというあなたのコメントと矛盾するようです。おそらく、この質問で私が見ている行動は期待されるでしょうか? –

+0

その答えは具体的には、あなたがやっていることで修正が使用されていることを示しています。クライアント側のルータを使用している場合は、店舗を構築するJavaScriptをリロードしないため、複数のルートにまたがって保持されます。問題はあなたのコードのどこかにあります。あなたはどのようにアプリを提供していますか? webpack devのサーバーまたはエクスプレスを介して?これはdevとprodの両方で起こりますか? – azium

答えて

0

<a>要素を反応ルータからインポートした<Link>要素に置き換えてこの問題を修正しました。これは、ユーザーがアドレスバーに新しいURLを手動で入力してもリンクの問題を解決した場合の問題を解決するものではありません。私はそれが実際に期待される行動だと信じています。私が間違っていると誰かが私を訂正すると確信しています。

+1

ああええ、理にかなっています。手動で入力したURLの問題は、localstorageを使用して修正できます(サポートが必要な場合)。もしそうなら、redux-persistライブラリを見てください。 – azium

関連する問題