Tengo una TouchableOpacity configurada como se muestra a continuación:

 <View style={{flexDirection: 'row'}}> <TouchableOpacity onPress={() => selectImage()} style={{backgroundColor: COLORS.lightGray3, width: SIZES.width, height: 200, borderTopRightRadius: 15, borderTopLeftRadius: 15,}}> <TouchableOpacity onPress={() => setModal(!modal)} style={{backgroundColor: 'white', width: 20, height: 20, borderRadius: 15, alignSelf:'flex-end', right: 10, top: 10}}> <Icon name='x' size={20} style={{color: 'red'}}/> </TouchableOpacity> {array.picture == null ? <View style={{alignItems: 'center', flexDirection: 'column', top: 50}}> <Text>No Image Selected. </Text> </View> : <Image resizeMode='cover' source={{uri: array.picture}} /> } </TouchableOpacity> </View>

En este TouchableOpacity es un condicional para cargar una imagen uri desde una matriz una vez que la imagen ha sido seleccionada a través de selectImage(); incluso si array.picture NO ES igual a nulo, mostrará el mismo texto "Sin imagen seleccionada" o un fondo gris.

ARREGLO :

 [{"name": "test", "picture": "file:///Users/user/Library/Developer/CoreSimulator/Devices/C10A4A25-D633-44E8-AE53-AD8DD9601A82/data/Containers/Data/Application/C68582F5-CA35-4DD6-9D15-36A254411CD9/tmp/3E9EBBE3-AC1A-4C61-927E-DD168BD037A5.jpg", "price": 12}]

IMAGEN DE LA PANTALLA :

TAMBIÉN , todo esto se muestra dentro de un modal.

¿Alguien está seguro de por qué está ocurriendo esto? ¡Gracias!