React-native-swiper: Warning: Failed prop type: Invalid prop `style` supplied to `_class`.

[xiaobai1990zhan]

Version

• react-native-swiper v1.5.10

Code

<Swiper loop={false}>XXXXX</Swiper>
I didnot write any styles, but it warning.

[arribbar]

I do not have any warning with no style in my swiper.
Can you fork the project and reproduce your warning in an example ?

[fabiorbap]

I second @xiaobai1990zhan problem, I'm using the styled components lib, I'm not sure if it's related.

// tslint:disable-next-line:no-var-requires
const ViewPager = require('react-native-swiper');

export const OnboardTutorialViewPager: any = styled(ViewPager)`
`;

And in the component render method

render() {
    return (
      <OnboardTutorialViewPager>
        <OnboardTutorialPageStyled>
          <OnboardTutorialImageStyled
            source={{ uri: 'https://upload.wikimedia.org/wikipedia/commons/thumb/f/f4/Nietzsche187c.jpg/170px-Nietzsche187c.jpg' }}
          />
        </OnboardTutorialPageStyled>
        <OnboardTutorialPageStyled>
          <OnboardTutorialImageStyled
            source={{ uri: 'https://upload.wikimedia.org/wikipedia/commons/thumb/f/f4/Nietzsche187c.jpg/170px-Nietzsche187c.jpg' }}
          />
        </OnboardTutorialPageStyled>
        <OnboardTutorialPageStyled>
          <OnboardTutorialImageStyled
            source={{ uri: 'https://upload.wikimedia.org/wikipedia/commons/thumb/f/f4/Nietzsche187c.jpg/170px-Nietzsche187c.jpg' }}
          />
        </OnboardTutorialPageStyled>
      </OnboardTutorialViewPager>
    );
  }

[gazedash]

It also complains about array of styles.

[elquimista]

I'm experiencing a similar issue here. No warnings without any style though. But it complains if I assign custom styles, either style, activeDotStyle, or dotStyle.

[nineto4]

Having the same issue
<Swiper .... style={[styles.swiperImg]} .... </Swiper>
Should be: style={ styles.swiperImg }

[damianfarina]

Don't know what's the issue with array of styles, but here is a workaround:
This piece of code

style={[firstStyle, secondStyle]}

is equivalent to

style={StyleSheet.flatten([firstStyle, secondStyle])}

and the warning is gone.

[kaladivo]

I get the same warning with styled-components.

[Danny-weebo]

@arribbar
This warning showing up when using styled-components (not with style prop).
I'm also facing that warning,

Warning: Failed prop type: Invalid prop `style` supplied to `_class`.

const SwiperView = styled(Swiper)``;

versions
RN: 0.55.4,
React: 16.3.1,
react-native-swiper: 1.5.13

[ammichael]

I'm also having this issue with styled-components. Any update on this?

[ammichael]

@leecade sorry to bring you up here, but I'm pretty sure this fix is something really quick for someone skilled enough to put this lib together. this warning has been haunting my console for a while now. could you please help out the poors using styled components together with swiper?

thanks a lot!

[samuhay]

That is still a thing