我在html页面中有3个组件。
A，B，C
通过PSD设计，在DOM级别A includes B and B includes C.
所以在React级别，我想设计组件树如下：
A(stateful component) ->B (stateless component) ->C (stateless component)
我将通过A方法生成connect redux-aware ，并传递redux状态to B then -> C。
然而，许多指南建议有状态组件只能包含无状态组件，而没有提及是否：
1。无状态组件可以包含另一个无状态组件吗？
2。无状态组件可以包含另一个有状态组件吗？
第3。有状态组件可以包含另一个有状态组件吗？
所以无论如何，如何设计我的组件，提前谢谢!!
A(stateful component) ->B (stateless component) ->C (stateless component)
B和C 期望 A 的状态传递给他们。**
答案 0 :(得分：1)
有时您可以了解更多我的阅读示例代码，看一下example Todo List provided by redux它清楚地表明#include<stdio.h>
void main(){
int array[100],temparray[100];
int i,n;
scanf("%d", &n); // size of array
for(i=0;i<n;i++)
{
scanf("%d", &array[i]);
}
for(i=0;i<n;i++){
temparray[i]=array[i];
}
for(i=0;i<n;i++)
{
printf("%d", temparray[i]);
}
}
包含MainSection和TodoItem两者都是有状态的Footer本身就是有状态的。一个主要的例子甚至可能是Material-UI库，它是所有有状态组件，您可以将它与无状态或有状态组件一起使用。
无状态组件没有理由不包含无状态组件，没有理由无状态组件不能包含有状态组件。包含有状态组件的无状态组件的示例有时是您的顶级MainSection或App文件。如果上面链接的repo，请查看index。
包含有状态组件的有状态组件的主要问题是对UI进行了大量不必要的更新。这些有时候并不明显，因为影子DOM与DOM相对并进行了适当的更改，但是差异的成本却非常低，每次状态发生变化时都会触发操作。
解决此问题的一个好方法是让您的组件在其部门中保持相当平坦，或者根据需要实现App.js功能。
由于关注点分离，在组件中使用状态只会使事情更易于管理，因此我发现很难相信在有状态或无状态组件下使用它们可能是一个问题。无状态组件将在每次包含它们的组件呈现时呈现，因此将无状态组件嵌入无状态组件中的问题可能是深度问题之一，即DOM越深，diff操作越复杂（纯粹基于经验猜测）因此指南不鼓励这样做，以便你可以保持你的树尽可能平坦。
老实说，只要您使用良好的编码习惯并了解决策的后果，我就不会发现任何问题。