Dec 2, 2020
0
Level 8
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())}/>
Please or to participate in this conversation.