Reactjs React.js如何在不使用refs的情况下调用子组件方法?
我有一个不寻常的病例。比如说,我有一张表格。当用户单击“保存”按钮时,我需要触发一个组件的方法将draft.js内容转换为HTML。通常我只是使用refs来访问child并调用任何方法。但在我的例子中,draft组件位于react router v4的render方法中,只有在URL匹配模式时才会出现。 这是一个障碍,因为当我定义ref时Reactjs React.js如何在不使用refs的情况下调用子组件方法?,reactjs,react-router,Reactjs,React Router,我有一个不寻常的病例。比如说,我有一张表格。当用户单击“保存”按钮时,我需要触发一个组件的方法将draft.js内容转换为HTML。通常我只是使用refs来访问child并调用任何方法。但在我的例子中,draft组件位于react router v4的render方法中,只有在URL匹配模式时才会出现。 这是一个障碍,因为当我定义ref时 <Match pattern={'/info'} render={(props)=> <Draft_Editor ref='editor'
<Match pattern={'/info'} render={(props)=> <Draft_Editor ref='editor' />} />
}/>
父组件在引用中没有此“编辑器”。如何从父级调用该方法?我找到了适合我的案例的解决方案。不幸的是,解决方案使用的是
ref
,但它使用其他方法执行。我没有做这个ref='editor'
而是做了这个ref={(草稿)=>this.aboutEditor=draft}
。此编辑器将作为This.aboutEditor
提供。
当我使用ref
作为字符串操作时,它不起作用。但它可以作为回调函数正常工作 一种方法如下
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组件实例:谢谢。我不知道这种反应能力