2017-09-17 5 views
0

上の初期状態を返します。)ReduxのgetStateをアプリに反応し、ユーザーが要求を送信する場合は、次のタスクを実行している私は同型を構築していますサーバー

1を想定ユーザーは/about-usを打つ、反応し、ルータに適切なコンポーネントを見つけmatchPathをし、それを返します。
2)アクションaboutPageContent()をディスパッチするfetchDataという静的関数が呼び出されます。 3)サーバー上で約束が解決されると、更新状態を取得するためにgetStateが呼び出されますが、が返されますが、aboutPageのinitialStateが返され、新しく更新された状態ではありません

リデューサは応答を得ますが、新しい状態を返しません。 (これは、アクションがサーバーによってディスパッチされた場合にのみ発生します)。

{ 
    aboutUs:{ 
     founders:[{}] 
     story: "" 
    } 
} 

しかし、それは返す必要があります:

{ 
    aboutUs:{ 
    founders:[{name: 'abc'}] 
    story: "some random story" 
    } 
} 

server.js

app.get("*", (req, res) => { 

const memoryHistory = createMemoryHistory(req.url) 
const currentRoute = routes.find(r => matchPath(req.url, r)) 
const store = configureStore({}, memoryHistory) 

if (currentRoute && currentRoute.component.fetchData) { 

    Promise.all(currentRoute.component.fetchData(store, req.url)).then(() => { 

     const content = (
      <StaticRouter location={req.url} context={{}}> 
       <Provider store={store}> 
        <App /> 
       </Provider> 
      </StaticRouter> 
     ) 

     const htmlContent = renderToString(content) 

     const preloadedState = store.getState() <----- Returns initialState and not the updated state. 

     const html = renderToStaticMarkup(<HtmlDocument html={htmlContent} preloadedState={preloadedState} />) 

     res.status(200) 
     res.send(html) 
    }) 
} 
}) 

aboutPageContainerをサーバーが返すの

getStateを。 JSX

static fetchData = (store) => [store.dispatch(aboutPageContent())] 

preloadedStateはwindow.__dataに割り当てられます。そしてクライアントストアをロードするためにwindow.__dataがclient.jsで呼び出されます。

何か間違っていますか?それは私の最初の反応同形アプリです。

答えて

1

あなたは以下のようなアップデートを入手するには、ここにストアする必要があると思います。 store.subscribeを使用すると、内部に更新された状態が得られます。それが役に立てば幸い。 Read http://redux.js.org/docs/api/Store.html#subscribelistener

store.subscribe(() => { 
// When state will be updated(in this case, when items will be fetched), this is how we can get updated state.      
    let items= store.getState().items; 
       }) 
関連する問題