TypeError: Cannot read property 'width' of undefined when using ImageBackground

Question

I am using the ImageBackground component from React Native. However, no matter what style I choose the same error message always displays. The code looks as it follows:

  render() {
return (
  <ImageBackground
    source={require('./common/Background_image.png')}
    stlye={styles.backgroundStyle}
  >
    <Text>Some text here!!</Text>
  </ImageBackground>
);

}

  backgroundStyle: {
flex: 1,
width: null,
height: null,
resizeMode: 'cover'}

Image of the error here

React-Native version: react-native-cli: 2.0.1 react-native: 0.55.4

Any ideas of what this may happen?

why do you pass width: null, height: null,. Just delete it and try again. — Helmer Barcos
– Helmer Barcos, Commented Dec 9, 2018 at 18:48

Helmer Barcos · Accepted Answer · 2018-12-09 18:51:09Z

7

You are passing stlye but the correct syntax should be style

<ImageBackground
    source={require('./common/Background_image.png')}
    style={styles.backgroundStyle}
>
  <Text>Some text here!!</Text>
</ImageBackground>

answered Dec 9, 2018 at 18:51

Helmer Barcos

2,10317 silver badges18 bronze badges

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

1 Comment

marcos-cr Over a year ago

Thanks a lot! I spent like 2 hours with this silly mistake!

Collectives™ on Stack Overflow

TypeError: Cannot read property 'width' of undefined when using ImageBackground

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related