Digamos que tengo varias capas de composición:
const ComponentA = ({ firstProp, secondProp }) => { reutrn <div>Component A</div> } const ComponentB = ({ thirdProp, fourthProp }) => { reutrn <ComponentA firstProp='first prop' secondProp='second prop' /> } const ComponentC = ({ fifthProp }) => { return <ComponentB thirdProp='third prop' fourthProp='fourth prop' /> } Ahora he dado una instancia de ComponentC y quiero acceder a todos los accesorios en la jerarquía de composición.
¿Cómo puedo hacer eso?
Actualizar
Para aclarar más, estoy hablando de reflexión.
Me han dado una instancia de ComponentC y quiero averiguar sus accesorios usando componentCInstance.props y luego averiguar los accesorios del ComponentB de ese componentCInstance etc.
Respuesta corta: no puede acceder a todos los accesorios en el Componente C de esta manera.
Solución 1: si el componente C es la fuente de todos los accesorios, debe definirlos allí y pasar el árbol de componentes
Solución 2: si su jerarquía es demasiado larga, considere usar Context ( https://reactjs.org/docs/hooks-reference.html#usecontext ).
Solución 3: si sus accesorios son independientes del Componente C y forman parte del estado de la aplicación, considere usar una herramienta de administración de estado (por ejemplo, https://redux.js.org/ )