は起動しませサーバーに反応 - 私はアプリを反応させ、ここで私のサーバーコードでいるrenderProps

Question

で何か：

app.get('*', (req, res) => { 
    let history = createMemoryHistory(); 
    let store = configureStore(); 
    let routes = createRoutes(history); 
    match({ routes, location: req.url }, (error, redirectLocation, renderProps) => { 
    if (redirectLocation) { 
     res.redirect(301, redirectLocation.pathname + redirectLocation.search); 
    } else if (error) { 
     res.status(500).send(error.message); 
    } else if (renderProps == null) { 
     res.status(404).send('Not found'); 
    } else { 
     let { query, params } = renderProps; 
     let comp = renderProps.components[renderProps.components.length - 1]; 
     console.log('fetching'); 
     comp.fetchData({ store, params }) 
     .then(() => { 
      console.log('done fetching'); 
      let html = ReactDOMServer.renderToString(
       <Provider store={store}> 
       { <RouterContext {...renderProps}/> } 
      </Provider> 
     ); 
      const template = store.getState().template; 
      const og = templateToOpenGraph(template); 
      const full = wrap(html, store.getState(), og); 
      res.set({ 'Cache-Control': 'public, max-age=300' }) 
      res.send(full); 
     }) 
    } 
    }); 
}) 

私は、サーバーを起動すると、それがうまく起動します。しかし、ルート（任意のルート）に当たると、エラーが発生します。 TypeError: comp.fetchData is not a function

何をする必要がありますか？私は反応が最大ではないので、明らかに何かが不足している場合は、私に知らせてください。

ありがとうございます！

Answer 1

お客様のコンポーネントにメソッドfetchDataがあるはずです。

私はあなたのルートの設定はありませんが、たとえば、あなたのroutes.jsファイル

<Route path="/" component={Root}> <Route path="view/:id" component={View} /> ... </Route>

にこのようなものを持っているあなたは、あなたのブラウザでページhttp://example.com/view/1231をロードすると、コンポーネントViewがレンダリングされます。メソッドfetchDataを実装する必要があります。このメソッドはレンダリングの前に呼び出されますView

class View extends React.Component { 
    fetchData() { 
    // implement fetch data here 
    } 
    ... 
}