1

I am learning React Native. Following the guide, Getting Started of Facebook ( https://facebook.github.io/react-native/docs/props ). When I tried to make a new component containing an image sometimes works and sometimes not. I have read online that this is due to how they are load, React Native doesn't support dynamic loading of images.

class CuteImage extends Component { render() { return ( <View> <Image source={{uri: 'https://cdn1.medicalnewstoday.com/content/images/articles/322/322868/golden-retriever-puppy.jpg'}} /> </View> ); } } export default class ExampleComponent extends Component { render() { return ( <View style={{alignItems: 'center', justifyContent: 'center', flex: "1", flexDirection: "column"}}> <CuteImage /> </View> ); } } 

I expected this to work fine because in the Image Component tutorial they did something similar and it had worked ( https://facebook.github.io/react-native/docs/image ) but it throws me the following error:

Failed to construct 'Image': Please use the 'new' operator

Why is this happening? How dynamic and static loading relates to this?

1 Answer 1

2

I think you forgot to add dimensions for your image. The docs say here that you have to provide them when using network and data images. I attached a screenshot of the result, it works now.

<View> <Image style={{width: 380, height: 340} } source={{uri: 'https://cdn1.medicalnewstoday.com/content/images/articles/322/322868/golden-retriever-puppy.jpg'}} /> </View> 

Cheers.

App screenshot

Sign up to request clarification or add additional context in comments.

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.