Actualmente tengo un proyecto en el que estoy ingresando dos valores en un componente de reacción para una ventana modal.

Uno de los hijos es el src para que se muestre el archivo. Otra es una cadena que se usa para hacer referencia de qué Array se extrae el src.

Quiero pasar dos niños al componente y usarlos de forma independiente para diferentes propósitos.

Aquí estoy llamando al componente:

 <Modal open={isOpen} onClose={() => setIsOpen(false)}> {accordionItems[activeSet].items[activeTrack].data} {activeString} </Modal>

Aquí está el interior del componente:

 export default function Modal({ open, onClose, children, activeString}) { if (!open) return null return ( <> <div style={MODAL_STYLES}> <div onClick={onClose}>Close Modal</div> {activeString} {children} </div> </div> </> ) }

El resultado muestra a los elementos secundarios perfectamente bien, que es lo que se usa para hacer referencia a accordionItems[activeSet].items[activeTrack].data; sin embargo, la cadena activa no se muestra, pero funciona bien si solo introduzco un parámetro en el componente (la cadena activa).

¿Por qué es esto?

¿Estoy haciendo esto correctamente? ¡Necesito poder acceder a ambos!

Gracias