React.js-如何在不钻取道具的情况下将事件处理程序传递给深层嵌套的组件? [英] React.js - how to pass event handlers to deeply nested component without props drilling?

问题描述

我的组件(嵌套)的结构看起来像这样:

I have the structure of components (nested) that seems like this:

• 容器
  • ComponentA
    • ComponentB
      • ComponentC(想要在此处处理事件并保持在容器中的状态)
      • Container
        • ComponentA
          • ComponentB
            • ComponentC(want to handle event here with state that lives on container)

            我是否需要从Container，ComponentA，ComponentB以及最终ComponentC一直传递为道具，以使用此处理程序?还是有使用Context API的另一种方式?

            Do I need to pass as props all the way from Container, ComponentA, ComponentB and finally ComponentC to have this handler? Or is there another way like using Context API?

            正因为如此，我发现使用react.js和vue.js/angular.js处理事件有点困难.

            I'm finding a bit hard to handle events with react.js vs vue.js/angular.js because of this.

            推荐答案

            我建议使用上下文API (如您所述)或高阶组件(HoC)

            I would recommend using either Context API (as you mentioned) or Higher Order Components (HoC)

            这篇关于React.js-如何在不钻取道具的情况下将事件处理程序传递给深层嵌套的组件?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！