index value will be out of reange after updating the UseState

[Ankush-Hegde]

Which OS ?

Android

• react-native-swiper v?

"react-native-swiper": "^1.6.0",

Expected behaviour

there are 3 buttons, when the button is clicked the "activeComponent " state is updated, it must update the index of the swiper based on the activeComponent state. and when we swipe it must work normally from the updated index.

Actual behaviour

swiper works normally in the beginning.
even the clicking on the button changes the index of the swiper.
But after clicking on the button if we swipe we get the unexpected behaviour.when we swipe we get the blank screen.whene we swipe again we will be jumped to the another screen etc.


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.

const [activeComponent, setActiveComponent] = useState("teachingRequests");
<Pressable
onPress={() => {
setActiveComponentAndResetPage("zero");
}}
>

zero

<Pressable
onPress={() => {
setActiveComponentAndResetPage("one");
}}
>

one


<Pressable
onPress={() => {
setActiveComponentAndResetPage("two");
}}
>

two




<Swiper
showsButtons={false}
showsPagination={false}
loop={false}
horizontal={true}
index={
activeComponent === "zero"
? 0
: activeComponent === "one"
? 1
: 2
}
onIndexChanged={(index) => {
const components = [
"zero",
"one",
"two",
];

        console.log(index);
        console.log(components[index])

        setActiveComponent(components[index]);
        
        if (components[index] === "zero") {
          setCurrentPage(1);
          ZeroHandler(1);
        } else if (components[index] === "one") {
          setCurrentPage(1);
          OneHandler(1);
        } else if (components[index] === "two") {
          setCurrentPage(1);
          TwoHandler1);
        }
      }}
    >

Steps to reproduce

1.swipe to the last scrollview
2.then click on first button "zero"
3. then swipe u will get the blank screen
4. the console log of the index will be in negative and sometimes will be out of range as here the index must be 0,1,2 but it goes to 3, -1 , -2 etc
5. this is console log
LOG 1
LOG one
//above is the first right swipe
LOG 2
LOG two
//above is second right swipe
LOG 0
LOG zero
//above log is when clicked on zero button
LOG -1
LOG undefined
LOG 2
LOG two
//above log is when swiped right