React-native-swiper: Swiper is not working with react native 0.61

Created on 27 Sep 2019  ·  15Comments  ·  Source: leecade/react-native-swiper

Which OS ?

Version

Which versions are you using:

  • react-native-swiper v? - 1.6.0 nightly 5
  • react-native v0.61.1

Expected behaviour

it should swipe to next

Actual behaviour

its not swiping to next slide

How to reproduce it>

To help us, please fork this component, modify one example in examples folder to reproduce your issue and include link here.
-

Steps to reproduce

  1. upgrade to react-native 0.61.1

  2. 3.
Missing Example Needs Repro

Most helpful comment

A quick workaround is that
Install and auto link npm i @react-native-community/viewpager

then run react-native run-android

Go to node_modules\react-native-swiper\src\index.js and

remove ViewPagerAndroid import from 'react-native' and add this import ViewPager from "@react-native-community/viewpager";

and then at line 652 of index.js replace <ViewPagerAndroid /> with <ViewPager/>

that made it work for me.

All 15 comments

React Native just moved the ViewPager from its core and to a separate package @react-native-community/viewpager
which is used in this component, I just had to change the ViewPagerAndroid in the component code to be imported from the separate package and it worked.

import ViewPagerAndroid from "@react-native-community/viewpager";

I had this issue using 1.5.14 but I updated to 1.6.0-nightly.5 and it's now working, weird you are still seeing this in v1.6. This was fixed in #997

@ursNj I cann't reproduce it by using the example project

=> https://github.com/leecade/react-native-swiper/tree/develop/examples

Can you provide one example as the issue template show?


To help us, please fork this component, modify one example in examples folder to reproduce your issue and include link here.

A quick workaround is that
Install and auto link npm i @react-native-community/viewpager

then run react-native run-android

Go to node_modules\react-native-swiper\src\index.js and

remove ViewPagerAndroid import from 'react-native' and add this import ViewPager from "@react-native-community/viewpager";

and then at line 652 of index.js replace <ViewPagerAndroid /> with <ViewPager/>

that made it work for me.

It's fixed in 1.6.0-rc.1

A quick workaround is that
Install and auto link npm i @react-native-community/viewpager

then run react-native run-android

Go to node_modules\react-native-swiper\src\index.js and

remove ViewPagerAndroid import from 'react-native' and add this import ViewPager from "@react-native-community/viewpager";

and then at line 652 of index.js replace <ViewPagerAndroid /> with <ViewPager/>

that made it work for me.

Works for me, THX

There is a version, that contains updated ViewPager: https://www.npmjs.com/package/react-native-swiper/v/1.6.0-dev.1

While the import is fixed, it seems to be only a temporary solution.

  1. It is only available in a release candidate version? So I guess there is a reason why it is not a stable release yet?
  2. Swiping is based on Scrollview now instead of the suggested ViewPager by react-native-community

Tried to register two views with the same name RNCViewPager 修改之后报这个错了

//Tried to register two views with the same name RNCViewPager

I use the version

"react-native-swiper": "^1.6.0-rc.3"

it work on 0.61.5

import ViewPager from "@react-native-community/viewpager";

Should do this:
import ViewPagerAndroid from "@react-native-community/viewpager";

You have never to touch the node modules source code, later when you make an update or reinstall the packages you will loose the changes you have made

So the best solution should be this command line :

yarn add react-native-swiper@next

hello,

I am new to react native, I am trying to implement react-native-swiper to my project

` render() {
return (
loop={false}
showsPagination={false}
index={1}>

    <View style={this.viewStyle()}>
      <ActivityScreen />
    </View>

    <Swiper
      horizontal={true}
      loop={false}
      showsPagination={false}
      index={1}>

      <View style={this.viewStyle()}>


    </Swiper>     

      <View style={this.viewStyle()}>
        <AlertScreen />
      </View>

    </Swiper>

)

}
}
`

But when I am "YourGroups" screen and click on the button

<Button title="thank you" onPress={()=>this.props.navigation.navigate("ThankScreen")} ></Button>

I get an error

undefined is not an object (evaluating 'this.props.navigation.navigate')

Was this page helpful?
0 / 5 - 0 ratings

Related issues

nicolabortignon picture nicolabortignon  ·  3Comments

wrannaman picture wrannaman  ·  3Comments

chetanparakh picture chetanparakh  ·  3Comments

gwhite-dayspring picture gwhite-dayspring  ·  3Comments

JonasOmdal picture JonasOmdal  ·  3Comments