ReactJS：在傳承組件作爲財產

Question

我創建了一個下拉菜單，我試圖將它傳遞給另一個組件：

var DropDownButton = React.createClass({ 
    getInitialState: function() { 
     return { 
      stage: 'Select' 
     } 
    }, 

    change: function(e){ 
     this.setState({ 
      stage: e.target.value 
     }); 
    }, 

    render: function() { 
     return (
      <div key={i}> 
       <select id='dropdown' onChange={this.change} value={this.state.value}> 
        <option value="Select">Select</option> 
        <option value="1">Option1 </option> 
        <option value="2">Option2 </option> 
       </select> 
      </div> 
     ) 
    } 
}); 

我想通過這個菜單爲CreateCandidate：

return (
      <div> 
       {pageHeaderInstance} 
       <CreateCandidate addCandidate = {this.addCandidate} /> 
       <ShowTable people= {this.state.people} /> 
      </div> 
     ) 

Inside CreateCandidate我創建了新的對象，我想包括下拉菜單作爲它的一部分。如何將整個組件傳遞到其他組件？我在想是這樣的：

<CreateCandidate addCandidate = {this.addCandidate} dropdownmenu = { ..add dropdownButton component..} 

Answer 1

你可以通過創建JSX成分越簡單

<CreateCandidate addCandidate = {this.addCandidate} dropdownmenu = {<DropDownButton/>} 

Answer 2

正確的做法是進口部件在CreateCandidate組件，然後使用它，而不是從父穿過部件

導入像

import {DropDownButton} from '/path/to/DropDownButton'; 

，並以此爲<DropDownButton/>

還要確保您導出DropDownButton組件一樣

module.exports = DropDownButton;