如何通過服務器端渲染將數據傳遞給來自節點的React組件

Question

我試圖將一些數據傳遞給我的組件。我發現這個例子：http://www.tech-dojo.org/#!/articles/56b1af3e8ff769fc29f96ae8 我創建了一個類DataWrapper它看起來像在例如：

import React, { Component } from 'react' 

export default class DataWrapper extends Component { 

    constructor(props) { 
    super(props) 
    } 

    getChildContext() { 
    return { 
     data: this.props.data 
    }; 
    } 

    render() { 
    return this.props.children; 
    } 
} 

DataWrapper.childContextTypes = { 
    data: React.PropTypes.oneOfType([ 
    React.PropTypes.object, 
    React.PropTypes.string 
    ]).isRequired 
}; 

節點服務器：

app.get('*', (req, res) => { 
    match({ routes, location: req.url }, (error, redirectLocation, renderProps) => { 
     ... 
     const body = renderToString(
     <MuiThemeProvider muiTheme={theme}> 
      <DataWrapper data={'somedata'}> 
      <RouterContext {...renderProps} /> 
      </DataWrapper> 
     </MuiThemeProvider> 
    ) 
     res.render('index', { title, body }) 

我的分量，我想用數據的模樣這個：

export default class Template extends Component { 

    constructor(props, context) { 
    super(props, context) 
    console.log("Template context", context.data); 
    ... 

context.data總是未定義的。我錯過了什麼？有沒有其他方法可以做到這一點？

Answer 1

If contextTypes is not defined, then context will be an empty object.，直接從React Docs引用。 https://facebook.github.io/react/docs/context.html#how-to-use-context

您將需要添加

Template.contextTypes = { 
    data: // whatever type it is 
}