React.js：將道具傳遞給反應路由器鏈接組件

我想通過react-router將組件中的道具傳遞給子組件。我的流程是這樣的：NaturalPersonList-> nav-> Naturalperson。 NaturalPersonList組件呈現導航組件，在我的導航組件中，我使用react-router的鏈接模塊鏈接到Naturalperson組件。我想從我的NaturalPersonList組件傳遞一個道具到Naturalperson，但由於Naturalperson沒有被明確渲染，我只是鏈接到它，所以我無法傳遞道具。有沒有什麼辦法可以達致這}React.js：將道具傳遞給反應路由器鏈接組件

NaturalPersonList：

var Nav=require('./nav.jsx'); 
var Router = require('react-router'); 
module.exports = React.createClass({ 


     render: function render() { 

     return (<div><Nav nav1="Natural Person 1" nav2="Natural Person 2" nav3="Natural Person 3" nav4="Natural Person 4" section1="NaturalPerson" section2="NaturalPerson" section3="NaturalPerson" section4="NaturalPerson" firstName={this.props.firstName}/> 
     <Router.RouteHandler {...this.props}/></div> 

     ); 
     } 
});

導航組件：

module.exports = React.createClass({ 

    displayName: 'nav', 

    render: function render() { 
    var activeClass = 'left-nav-selected'; 

    return (
     <section className='left-nav' id='left-nav'> 
     <div className='left-nav-title'>{this.props.name}</div> 
     <nav className='left-nav-links'> 
      <ul> 
      <li className='left-nav-link' id='nav-section1'> 
       <Link to=NaturalPerson params={{naturalPersonId: 1}} className={this.props.navSelection==='nav-section1'?activeClass:''} 
        activeClassName={activeClass}>{this.props.nav1}</Link> 
      </li>  
      </ul> 
     </nav> 
     </section> 
    ); 
    } 
});

NaturalPerson：

module.exports = React.createClass({ 


    getInitialState :function() { 
    return{ 
      readOnly : true 


      }; 
      }, 

      submit : function(){ 
      this.setState({readOnly : false}); 
       console.log(this.state.id); 
      }, 
      save : function(){ 
      this.transitionTo('/'); 
      }, 

     render: function render() { 

     return (<form action="/Output" method="POST" ><div id="container_suspects"> 
      <input type="submit" value="Save" ></input>  
      <button type="button" onClick={this.submit} >Edit Details</button> 
     <div id="suspects_personal_details"><PD hidden="hidden" readOnly={this.state.readOnly} 
     firstName={this.props.firsName}/><br/><br/> 
     <PNS hidden="hidden" readOnly={this.state.readOnly}/><br/><br/> 
     <Email readOnly={this.state.readOnly} /><br/><br/></div> 
     <div id="suspects_address"><A readOnly={this.state.readOnly}/><br/><br/></div> 

     </div> 
     </form> 
     ); 
     } 
});

來源

2016-04-28 medha

如果我理解正確的話。您可以發送鏈接的道具：

<Link to=NaturalPerson params={{naturalPersonId: 1}} 
     className={this.props.navSelection==='nav-section1'?activeClass:''} 
     params={params: {dictionary}} 
     activeClassName={activeClass}> 
    {this.props.nav1} 
</Link>

來源

2016-04-28 09:49:54

React.js：將道具傳遞給反應路由器鏈接組件

回答

相關問題