Tengo una cadena que es el nombre del ícono que quiero importar/requerir y estoy tratando de importar/requerir el archivo SVG que quiero usar en React Native dinámicamente. Mi idea inicial fue esta:

 const icon = require(`@src/assets/icons/${iconName}`)

Sin embargo, me di cuenta de que esto no funcionaría y que necesito importar todas mis opciones de íconos. Es por eso que creé un archivo Icons.ts desde el cual intento solicitar y luego exportar todos mis íconos de esta manera:

 const Icons = { ArrowRight: import('@src/assets/icons/ArrowRight.svg'), ArrowLeft: import('@src/assets/icons/ArrowLeft.svg'), }; export default Icons;

Y luego traté de usarlos en mi componente como codificando Icons.ArrowRight:

 {leftIcon && <IconContainer>{Icons.ArrowRight}</IconContainer>}

Lo cual desafortunadamente no funcionó y obtuve el siguiente error:

 Objects are not valid as a React child.

Si importo un icono directamente en mi componente como este:

 import Close from '@src/assets/icons/close.svg';

Entonces puedo usarlo así:

 <Close />