多個嵌套組件

Question

我想對我的內容進行封裝，以便可以在其中使用一些常規事件。所以它看起來像這樣：

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類包裝。我應該怎麼做？而從渲染函數返回

Answer 1

使用括號

var NestedData = React.createClass({ 

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

});