Реактивные изображения не отображаются - PullRequest
0 голосов
/ 18 октября 2019

Я использую swiper и не могу посмотреть фотографии, которые мне нужны. Я неправильно называю фотографии? Когда я пытаюсь отобразить фотографию как обычно с помощью тега изображения, она работает, поэтому я знаю, что импортирую фотографию из правильного каталога.

....
import Swiper from 'react-native-swiper';
....
const ProfileCardScreen = ({navigation}) => {

  var profilePhotos=[{image:require('../images/NYE.jpg')},{image:require('../images/hiking.jpg')},{image:require('../images/baseball.jpg')}];

  return (
    <View style = {styles.container}>
        <Text style={styles.profilePageUserName}>User Name Here</Text>
        <Swiper showsButtons={true}>
            <View style={styles.slide1}>
                <Image style={{flex:1, height: undefined, width: undefined}}
                    resizeMode="contain"
                    source={require('../images/NYE.jpg')}/>
            </View>
            <View style={styles.slide2}>
                <Image style={{flex:1, height: undefined, width: undefined}}
                    resizeMode="contain"
                    source={require('../images/hiking.jpg')}/>    
            </View>
            <View style={styles.slide3}>
                <Image style={{flex:1, height: undefined, width: undefined}}
                    resizeMode="contain"
                    source={require('../images/baseball.jpg')}/>          
            </View>
        </Swiper>

enter image description here

1 Ответ

0 голосов
/ 18 октября 2019

Синтаксис правильный, попробуйте импортировать изображения в операторе импорта, например

import Swiper from 'react-native-swiper';
import Image1 from '../images/NYE.jpg';
import Image2 from '../images/hiking.jpg';
import Image3 from '../images/baseball.jpg';
....
const ProfileCardScreen = ({navigation}) => {

var profilePhotos=[{image:require('../images/NYE.jpg')}, 
{image:require('../images/hiking.jpg')}, 
{image:require('../images/baseball.jpg')}];

 return (
<View style = {styles.container}>
    <Text style={styles.profilePageUserName}>User Name Here</Text>
    <Swiper showsButtons={true}>
        <View style={styles.slide1}>
            <Image style={{flex:1, height: undefined, width: undefined}}
                resizeMode="contain"
                source={Image1}/>
        </View>
        <View style={styles.slide2}>
            <Image style={{flex:1, height: undefined, width: undefined}}
                resizeMode="contain"
                source={Image2)}/>    
        </View>
        <View style={styles.slide3}>
            <Image style={{flex:1, height: undefined, width: undefined}}
                resizeMode="contain"
                source={Image3}/>          
        </View>
    </Swiper>

Если приведенный выше код также не работает, значит, в вашем стиле должны быть проблемы. Это все, что я могу сделать.

...