2016-08-15 83 views
0

我想对我的内容进行封装,以便可以在其中使用一些常规事件。所以它看起来像这样:多个嵌套组件

var Table = React.createClass({ 

    render: function() { 
     return (
      React.createElement('div', {}, 
       React.createElement('div', {className: 'TableDiv'}, 'Table div - click me') 
      ) 
     ); 
    } 

}); 

var NestedData = React.createClass({ 

    render: function() { 
     return React.createElement('div', {}, 
      React.createElement('div', {className: 'NestedDiv'}, 'Nested data div - click me') 
     ) 
    } 

}); 

var App = React.createClass({ 

    render: function() { 
     return React.createElement(Table, {}, 
      React.createElement(NestedData) 
     ) 
    } 

}); 

window.onload = function() { 
    ReactDOM.render(React.createElement(App), document.getElementById('content')); 
}; 

问题是没有显示嵌套div,只有Table类包装。我应该怎么做?而从渲染函数返回

回答

0

使用括号

var NestedData = React.createClass({ 

render: function() { 
    return ( 
     React.createElement('div', {}, 
     React.createElement('div', {className: 'NestedDiv'}, 'Nested data div - click me') 
    ) 
); 
} 

});