构建React应用程序

Question

我对React应用程序的体系结构有疑问。

该应用程序由主窗口小部件和一些其他子窗口小部件组成。他们每个人也可能有其他儿童小部件。这些小部件不知道它们做了什么，也不知道它们有多少（它们由用户提供）。

以下是一个例子：

在下面的图片中，最初有两个小部件，每个小部件都有几个子小部件。

1. 在第1步，这两个小部件是可见的，它们也有一些子小部件。
2. 在第2步，用户点击了页面上的某个位置。因此，第一个小部件中出现了另一个子小部件。
3. 在步骤＃3中，用户单击了窗口小部件2中的一些子窗口小部件。在这种情况下，只应显示此窗口小部件。小部件2中的其他人应该消失。
4. 在步骤＃4中，单击窗口小部件2中的子窗口小部件应该会导致窗口小部件1完全消失。

问题是 - 我们如何处理这种情况？我想点击子窗口小部件或页面上的某个位置应该通知root，这样它就会添加一个新的窗口小部件或跳过其他窗口的渲染。但是，我无法想象在该州投入什么以及如何实现这一目标。

Answer 1

所以，这就是我们在最后结束时的方式：

我们发明了所谓的＆＃34;独家模式＆＃34;一个小部件。父组件通过属性传递回调函数。然后，子窗口小部件可以请求以＆＃34;独占模式＆＃34;来呈现。 当正在请求渲染独占更多时，父级仅渲染那些与小部件的键匹配的小部件，请求独占访问。 这样，只能渲染一个工具栏，或者只能在给定的工具栏中渲染某个按钮。