图像显示在模拟器IOS中，而不显示在真实设备中

Question

在模拟器中，图像可以完美显示，但是在编译并将其发送到商店时，导航栏的图像无法正确显示

模拟器： 模拟器中的图像可以完美显示

设备： 在设备上的图像如下所示

代码：

import React from "react";
import {createStackNavigator,DrawerActions} from 'react-navigation';
import {
    TouchableOpacity,
    View,
    Image,
    Dimensions,
    Platform,
} from "react-native";


import DrawerScreen from './menu/DrawerScreen';
import Load from './screens/Load';
import CacheStore from 'react-native-cache-store';
import ListProduct from './screens/ListProduct';
import Points from './screens/Points';
import OffConnection from './screens/OffConnection';
import CategorieList from './screens/CategorieList';

const {width} = Dimensions.get('window');

let img = null;
setInterval(()=>{
    CacheStore.get('image').then((value) => {
        if(value === 1 ){
            img = require('../public/images/carShopRed.png');
        }else{
            img = require('../public/images/carShop.png');
        }
    });
},100);


export const HomeStack = createStackNavigator({
   screen_load:{
       screen:Load,
       navigationOptions:{
           header:null,
           drawerLockMode:'unlocked',
       }
   },
    screen_Off:{
       screen:OffConnection,
       navigationOptions:{
           header:null,
           drawerLockMode:'unlocked',
       }
   },
    screen_List: {
        screen: ListProduct,
        navigationOptions: ({navigation}) => ({
            headerLeft:
                <TouchableOpacity
                    onPress={() => {
                        navigation.navigate('Points');
                    }}
                >
                    <Image source={require('../public/images/back3.png')}
                           style={{
                               width: 40,
                               height: 35,
                               resizeMode: 'contain',
                               marginBottom:3,
                               marginLeft:4
                           }}
                    />
                </TouchableOpacity>,
            headerRight: "",
        }),
    },
    screen_Category: {
        screen: CategorieList,
        navigationOptions: ({navigation}) => ({
            headerLeft:
                <TouchableOpacity
                    onPress={() => {
                        navigation.navigate('Products');
                    }}
                >
                    <Image source={require('../public/images/back3.png')}
                           style={{
                               width: 40,
                               height: 35,
                               resizeMode: 'contain',
                               marginBottom:3,
                               marginLeft:4
                           }}
                    />
                </TouchableOpacity>,
            headerRight: "",
        }),
    },
    DrawerStack:{screen:DrawerScreen}

}, {
    headerMode: 'float',
    navigationOptions: ({navigation}) => (
        {
        headerStyle: {
            backgroundColor:'rgb(70,70,70)',

        },
        headerTitleStyle: {
            ...Platform.select({
                ios:{
                    width: width,

                }
            })

        },
            ...Platform.select({
                ios:{
                    title:
                        <Image source={require('../public/images/banner.png')}
                               style={{
                                   width:width,


                               }}
                        />,
                }
            }),
            ...Platform.select({
                android:{
                    headerBackground: <Image source={require('../public/images/banner.png')}
                                             style={{
                                                 width:width,
                                                 height:56,
                                             }}
                    />,
                }
            }),

        headerTintColor: 'black',
        headerLeftStyle:{
            backgroundColor:'rgb(70,70,70)',
        },
        headerLeft: <View>
            <TouchableOpacity
                onPress={() => {
                    navigation.dispatch(DrawerActions.toggleDrawer());
                }}
            >
                <Image source={require('../public/images/menu.png')}
                       style={{
                           width: 40,
                           height: 40,
                           resizeMode: 'center',
                           position:'relative',
                           marginLeft:10,
                       }}
                />
            </TouchableOpacity>
        </View>,
            headerRight:<View>
                <TouchableOpacity
                    onPress={()=>navigation.navigate('MyShopping')}
                >
                    <Image source={img}
                           style={{
                               width: 30,
                               height: 30,
                               resizeMode: 'center',
                               position:'relative',
                               marginLeft:5,
                           }}
                    />
                </TouchableOpacity>
            </View>
    })
});

这是我用来创建和放置导航图像的代码