React Router：在 RouteHandler ref 上调用组件函数

Question

我正在尝试调用子组件 RouteHandler 上的组件函数。

var Bar = React.createClass({
  baz: function() {
    console.log('something');
  },
  render: function() {
    return <div />;
  },
});

var Foo = React.createClass({
  baz: function() {
    this.refs['REF'].baz();
  },
  render: function() {
    return <RouteHandler ref="REF" />;
  },
);

其中 RouteHandler 是 Bar 但 this.refs['REF'].baz 是 undefined。

有关组件功能的详细信息，请参阅 https://facebook.github.io/react/tips/expose-component-functions.html。

Answer 1

我认为 react-router 目前不支持在 RouteHandlers 上公开组件功能，目前的 hacky 解决方法是：

this.refs['REF'].refs['__routeHandler__'].baz();

见https://github.com/rackt/react-router/issues/1597

React Router：在 RouteHandler ref 上调用组件函数

React Router: Call component function on RouteHandler ref

reactjs

react-router