2

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

//onswipe 函数

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>;

目前

4

0 回答 0