When re-rendering a ListView of Swipeables after removing an item that is opened, the next item renders open

[zznull]

I have a ListView where each item is a Swipeable. Each one has a leftButton that removes the item from the list. When the ListView is re-rendered, the following item starts open. The ListView is recreated in render(), triggered by state change from redux.

What could be causing this?

[PanRu]

Same issue with @zznull, not worked to set currentlyOpenSwipeable as null, and the ListView is re-rendered after deleted on item.

[PanRu]

@zznull Are you resolved this issue? I fixed it to use recenter() function.

For example as swipeable-example.js in current project, it not worked if you just set this.state.currentlyOpenSwipeable as null, but it worked to use this.state.currentlyOpenSwipeable.recenter();

[tereshchenkoartyom94]

Same issue with @zznull. I also fixed it with a recenter function

[hankzhuo]

@PanRu Thanks, I fixed this bug by your method here is my example:

_renderItem = () => {
    const { currentlyOpenSwipeable } = this.state;
    const rightButtons = [
      <TouchableOpacity onPress={() => 
          this.state.currentlyOpenSwipeable.recenter();
    }>
        <Text style={styles.delete}>delete</Text>
      </TouchableOpacity>
    ];

    const onOpen = (event, gestureState, swipeable) => {
      if (currentlyOpenSwipeable && currentlyOpenSwipeable !== swipeable) {
        currentlyOpenSwipeable.recenter();
      }

      this.setState({ currentlyOpenSwipeable: swipeable });
    };

    const onClose = () => currentlyOpenSwipeable.recenter();

    return (
      <View>
        <Swipeable
          rightButtons={rightButtons}
          onRightButtonsOpenRelease={onOpen}
          onRightButtonsCloseRelease={onClose}>
        </Swipeable>
      </View>
    )
}

by the way, English is not my first language :)

[tomLadder]

+1 have the same issue

[wilsonIs]

just add key prop and it works.

for example:

return (
        <Swipeable
          key={id}
          rightButtons={rightButtons}
          onRightButtonsOpenRelease={onOpen}
          onRightButtonsCloseRelease={onClose}>
        </Swipeable>
    )

[hraschan]

@wilsonIs Comment helped a lot! Thank you