Gabotronix's avatar

React Native: dynamic image require in component?

Hi everybody, I'm trying to show a randomly generated image in my Image component, however I'm getting the following error:

invalid call at line 58:require(getRandomImage())

My component:

const [ randomImages, setRandomImages ] = useState([
        //require('../assets/images/aranda.jpg'),
        require('@assets/images/bilmore.jpg'),
        require('@assets/images/cachalote.jpg'),
        require('@assets/images/lola.jpg'),
        require('@assets/images/meson.jpg'),
        require('@assets/images/paloma.jpg'),
        require('@assets/images/picasso.jpg'),
        require('@assets/images/pimpi.jpg'),
        require('@assets/images/tintero.jpg'),
        require('@assets/images/tropicana.jpg'),
    ]);

const getRandomImage = () =>
    {
        return randomImages[rand(0,9)];
    };

    const rand = (min, max) => 
    {
        return Math.floor(Math.random() * (max - min)) + min;
    }


<Image style={{ width:'100%', height:200,}}  resizeMode="cover" source={require(getRandomImage())}/> 
0 likes
0 replies

Please or to participate in this conversation.