相关疑难解决方法(0)

出于在控制台中进行调试的目的,React中是否有任何机制可以使用DOM元素实例来获取后备React组件？

之前已在生产代码中使用此问题的上下文中询问过此问题.但是,我的重点是用于调试的开发版本.

我熟悉React的Chrome调试扩展程序,但并非所有浏览器都可以使用.结合DOM资源管理器和控制台,可以很容易地使用"$ 0"快捷方式访问有关突出显示的DOM元素的信息.

我想在调试控制台中编写类似这样的代码:getComponentFromElement($ 0).props

即使在React开发版本中,也没有机制可以使用元素的ReactId来获取组件？

我有一个自定义组件Foo,其bar功能我想从外部触发:

class Foo extends React.Component {
   bar() { ... }
}

我绘制Foo了一起button,其目的是触发Foo.bar():

render() {

 return (
     <Foo ...>
     </Foo>
     <Button onClick={I want to trigger Foo.bar()} />
 );
}

我尝试过的事情:

1. 移动<Button >里面Foo,然后加入onClick的<Button/>在Foo's构造-鼠标点击的结合没有工作-我看它重视,但<Button />仍然不会触发onClick.(或者,如果它可以工作,如何正确地做到这一点)？

没有做我想要的解决方案:

1. 我看到一个可能的解决方案,它建议在整个过程中听一下点击MyComponent,然后做一些DOM查询以查找是否点击了实际的按钮.这不会对我的工作,但是,由于MyComponent它不拥有这些按钮(这些按钮都没有MyComponent.props.children),我宁愿一个集思广益的解决方案,不强迫我一定要移动内部的按钮.

2. 另一个潜在的解决方案不起作用:我不能render()将值返回<MyComponent />到a var myComp,然后在里面<Button onClick={() …