Question

我通过React Router渲染了一堆路由，在类中，我需要组件才能访问触发渲染的类的实例，因为它将包含服务工厂的实例等

但是，我找不到任何关于将道具传递给通过React Router渲染的组件的信息，或者对我有用的信息，将支柱传递给通过React Router渲染的每个组件，以便它们可供使用。

这可能吗？如果是这样，怎么样？

我的代码的浏览版本：

var routes = {
  component : 'div',
  childRoutes : [{
    path      : '/',
    component : AppContainer
  }]
};

// Not a React Component. Need a value from here, to 
// be passed to the AppContainer
class App {
  render() {
   let foo = 'bar';

    ReactDom.render(
      <Router history={history}
              routes={routes} />,
      document.getElementById('container')
    );
  }
}

// Rendered via React Router
class AppContainer extends React.Component {
  render() {
    console.log(this.props.foo); //bar
    return <div>{this.props.foo}</div>;
  }
}

Answer 1

如果你有一个根路由组件，你可以考虑一个非常简单的选项：

export default React.createClass({
    render: function() {
      return React.cloneElement(this.props.children, { propValue: someValueHere });
    }
});

除了创建您提供的子组件之外，它实际上没有任何其他功能，同时还会传递您选择的一些额外的道具。它可能永远不是你的解决方案，但它足以让你开始我希望。

将道具传递给每个组件

1 个答案: