esta es la primera vez que uso stackoverflow, soy nuevo en el uso de react native, he creado un navegador de pestañas y uso el paquete de iconos de expo @expo/vector-icons. Mi problema es que, cuando la aplicación se abre por primera vez, no se representan todos los iconos de las pestañas, lo que muestra un signo de interrogación. Después de hacer clic en tabBarIcon, ¿se muestra el icono? Debajo de eso está la pantalla de la pestaña de mi tarea de historial, otras de mis pantallas de pestañas también usan esta forma para mostrar el icono de la barra de pestañas.
Así que no sé cuál es el problema. Gracias por responder a mi pregunta.
Pantalla de la pestaña de tareas de historial
useLayoutEffect(() => { navigation.setOptions({ title: 'History Task', tabBarIcon: ({ focused }) => ( <MaterialIcons name="history" size={focused ? 30 : 24} color={focused ? 'rgb(0,122,255)' : 'black'} /> ), }); }, [navigation]);esta es la imagen antes de hacer clic en el botón de tabulación
esta es la imagen después de hacer clic en el botón de tabulación
Está configurando el ícono en useLayoutEffect dentro de la pantalla. Esto se ejecutará solo después de que se represente la pantalla.
De forma predeterminada, el navegador de la pestaña inferior muestra la pantalla de forma perezosa, es decir, las pantallas no se muestran hasta que las visita al menos una vez. Por lo tanto, el ícono no se configura hasta que realmente abre la pantalla.
No hay razón para configurar el ícono en un efecto en su pantalla. Muévalo a las options de apoyo en la pantalla o screenOptions en el navegador. setOptions solo debe usarse si desea compartir algún estado entre su componente y las opciones.
https://reactnavigation.org/docs/tab-based-navigation/#customizing-the-appearance
