React.js如何在不使用refs的情况下调用子组件方法？

Question

我有一个不寻常的案例。比方说，我有一个表格。当用户单击“保存”按钮时，我需要触发组件的方法将draft.js内容转换为HTML。通常我只是使用refs来访问子进程并调用任何方法。但在我的情况下，draft组件是react-router v4的render方法，只有在URL匹配模式时才会出现。 当我定义ref

时，这是一个障碍

<Match pattern={'/info'} render={(props)=> <Draft_Editor ref='editor' />} />

父组件在refs中没有这个'编辑器'。如何从父母那里调用方法？

Answer 1

一种方法如下。

1）使用以下命令查找父元素的DOM节点：

var parentDOM = ReactDOM.findDOMNode(parentCompInstance);

2）使用：

找到子元素的DOM节点

var childDOM = parentDOM.children[0]; // or something like this, depending on html hierarchy

3）使用此处提到的解决方案找到该子DOM节点的React组件实例：React - get React component from a child DOM element?

Answer 2

我为我的案子找到了解决方案。不幸的是，解决方案是使用ref，但它使用其他方法执行它。我做了ref='editor'而不是ref={(draft) => this.aboutEditor = draft}。此编辑器将以this.aboutEditor的形式提供。 当我使用ref作为字符串进行操作时，它确实有效。但它作为回调函数工作正常。