在onSwitching之后从react-swipeable-views中移除Element

Question

我正在使用SwipeableViews和要从数组中显示的映射元素。我想在用户每次向左或向右滑动时从数组中删除滑动的元素，并显示没有滑动元素的新元素。第一个元素是永远不应该删除的卡，然后我通过数组进行映射，这就是我希望能够删除用户刷卡的值的时候。到目前为止，这是我的代码。

//不滑动功能

onSwipe = (e, index) => {
  console.log(index);
  this.setState({ index: 0 });
  this.setState({ likeDislike: '' });
  const currentUserId = this.state.userData.length && this.state.userData[0].id;

  const newUserDataFunction = () => {
    console.log(index);
    const newUserData = this.state.userData;
    if (index >= 1 && this.state.userData.length) {
      newUserData.slice(1);
    }
    return newUserData;
  };
  const newUserData = newUserDataFunction();
  this.setState({ userData: newUserData });
  let nextValue = 0;
  nextValue = e;
 if (nextValue > this.state.current) {
   console.log('Disliked');
    this.setState({ current: nextValue });
  } else {
   console.log('Liked');
    this.setState({ current: nextValue });
  }
  this.setState({ firstItem: 'SWIPE RIGHT TO CONTINUE' });
  this.setState({ index: 0 });
};

返回

<SwipeableViews style={{ maxHeight: '100%' }} enableMouseEvents onChangeIndex={this.onSwipe} onSwitching={this.onUserSwitch} index={index}>
    <Card>
        <h1>Swipe Right To Begin</h1>      
    </Card>
    {userData.map(user => (
      <div key={user.id}>
        <Header>
          <span style={{ color: 'red' }}>
            {user.username}
          </span>
        </Header>        
      </div>
    ))}    
  </SwipeableViews>;

当前