Comment transmettre des propriétés aux composants du gestionnaire dans React Router ?

Passer des accessoires aux composants du gestionnaire dans React Router

Dans une application React exploitant React Router, il est nécessaire de transmettre des propriétés aux composants du gestionnaire chargés dynamiquement.

Considérez la configuration React Router suivante :

<code class="javascript">var Index = React.createClass({
  render: function () {
    return (
        <div>
            <header>Some header</header>
            <RouteHandler />
        </div>
    );
  }
});

var routes = (
  <Route path="/" handler={Index}>
    <Route path="comments" handler={Comments}/>
    <DefaultRoute handler={Dashboard}/>
  </Route>
);</code>

Pour transmettre des propriétés au composant Commentaires, vous pouvez étendre le composant Index comme suit :

<code class="javascript">class Index extends React.Component { // using babel here

  constructor(props) {
    super(props);
  }

  render() {
    return (
      <h1>
        Index - {this.props.route.foo}
      </h1>
    );
  }
}

var routes = (
  <Route path="/" foo="bar" component={Index}/>
);</code>

Cette approche vous permet d'accéder la propriété foo directement dans le composant Index, la transmettant effectivement au composant Comments.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!