4-way swiping not working as expected

react-native@0.34.1 / react-native-swiper@1.4.11

Use case: trying to implement a horizontal swipe where if you swipe one of the cards up, it disappears from the collection and the next slide is shown. Pretty straightforward.

For that, I tried the 4-way swipe example, but once you try to remove the 2nd slide, instead of seeing the "body" of the 3rd slide, you see the top part of the 3rd slide.

Is this a bug or am I doing something wrong? (maybe there's a better approach to this?)

import React, { Component } from 'react';
import { View, Text } from 'react-native';
import Swiper from 'react-native-swiper';

export default class Example extends Component {

    constructor(props) {
        super(props);
        this.state = {
            items: []
        };
    }

    componentWillMount() {
        this.setState({
            items: [
                { text: 'one' },
                { text: 'two' },
                { text: 'three' }
            ]
        });
    }

    handleHide(key) {

        /* remove that item */

        const items = this.state.items.slice();
        items.splice(key, 1);
        this.setState({ items });

        /* scroll to the next available slide */

        let scrollTo = key;
        if (this.refs.swiper.total > scrollTo) {
            scrollTo = this.refs.swiper.total;
        }

        this.refs.swiper.scrollBy(scrollTo);

    }

    render() {
        return (
            <Swiper
                showsPagination={false}
                index={0}
                ref={'swiper'}
            >
                {this.state.items.map((item, key) => {
                    return (
                        <View key={key}>
                            <Swiper
                                horizontal={false}
                                loop={false}
                                showsPagination={false}
                                index={1}
                                onMomentumScrollEnd={this.handleHide.bind(this, key)}
                            >
                                <View><Text>top of slide {key}</Text></View>
                                <View>
                                    <Text>slide {item.text} goes here</Text>
                                    <Text>scroll up or down to hide</Text>
                                </View>
                                <View><Text>bottom of slide {key}</Text></View>
                            </Swiper>
                        </View>
                    );
                })}
            </Swiper>
        );
    }

}

Start with the 4-way swipe example linked in the issue and the nested Swiper components in Example.render. Trace handleHide, especially the item removal and subsequent scrollBy call, while reproducing the case where the second slide is removed. Done means the next slide displays its body rather than its top section after an upward or downward swipe.