Question

处理从孩子到父母的信息冒泡的反应方式是通过回调。

（示例来源：react.js custom events for communicating with parent nodes。）

然而，这会在一段时间后变得非常麻烦，例如

Child = (props) => <div onClick={props.callback}/>
Parent = (props) => <Child callback={props.callback}/>
GrandParent = (props) => <Parent callback={props.callback}/>
GreatGrandParent = (props) => <GreatGrandParent callback={props.callback}/>

在这个示例中，GreatGrandParent从Child获取信息，我们必须通过Parent和GrandParent将其冒泡。

这种情况比我想象的更频繁，因为React强烈推荐小组件。

注意：我想要触发的实际事件不仅仅是一次简单的点击，我意识到我可以在这个例子中听祖父母的点击事件，但它更复杂。基本上只是想把孩子的一些数据冒泡到祖父母身上。

Answer 1

小分离组件的想法是开发应用程序更容易。当组件没有任何硬绑定/关系时，您只需在不需要构建关系上下文的情况下使用您需要的组件。

但是当你有一个盛大的大孩子需要通知他的盛大父母关于某事的情况时，你就已经建立了可能不利于发展过程的联系。

在那些情况下，我认为这个盛大的......孩子应该与盛大的......父母（减少）或商店（流量）进行沟通。最终通过上下文。

您可能遇到架构方面的问题而且必须稍微压扁组件？我认为正确的结构不应该有冒泡信息的问题，因为只有父级应该对其子组件事件感兴趣。然后父母应该处理信息并通知他的父母关于过程结果，但不仅仅是传递来自孩子的信息。

例如我们有：

输入组件＆amp;按钮组件
表单组件
页面组件

现在：

当我们输入要输入的内容时，它会通知表单组件有关类型化数据的信息。
但表单组件不必通知页面组件（页面组件对输入的字母不感兴趣）。
当用户点击按钮，然后按钮组件通知它表格（页面组件对按钮点击事件不感兴趣）。
但是当表单获取有关按钮单击的信息时，它会验证从输入接收的数据，并将此数据提交给服务器。
提交事件对页面组件很重要，因此表单仅将此信息发送到页面。

在我的例子中，我们不应该在输入和页面之间建立通信。

React - 处理嵌套回调的长链

1 个答案: