krillov krillov - 1 year ago 83
Node.js Question

How to pass data with server-side rendering to React-component from Node

I'm trying to pass some data to my components. I found this example:!/articles/56b1af3e8ff769fc29f96ae8
I have created a class DataWrapper which looks like in the example:

import React, { Component } from 'react'

export default class DataWrapper extends Component {

constructor(props) {

getChildContext () {
return {

render () {
return this.props.children;

DataWrapper.childContextTypes = {
data: React.PropTypes.oneOfType([


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

And my component where I want to use the data looks like this:

export default class Template extends Component {

constructor(props, context) {
super(props, context)
console.log("Template context",;
... is always undefined. What am I missing? Is there an other way to do this?

Answer Source

If contextTypes is not defined, then context will be an empty object., quoting directly from React Docs.

You will need to add

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