Question

我有一个应用程序，我有一个水平的项目列表，当你点击它们时，它们应该消失并触发一些动作。最小的示范：代码：https://codesandbox.io/s/5xpkn3nzxl

尝试相当快速地点击列表的头部，直到没有剩余。请注意，生成的事件与您点击的内容不匹配，最终会出现重复项。预期输出每个项目只有一个事件，并且剩余项目顶部的点击事件应该转到该项目，而不是正在消失的项目。我不确定这是不是一个错误，但我正在寻找有关如何最好地处理的建议。

（如果他们比react-spring更好地处理这个问题，我也会接受其他图书馆的建议。）

Answer 1

如果您发现clickHandler已经在item中，则可以向this.state.clicked添加早期收益。

clickHandler(item) {
    if (this.state.clicked.some(clickedItem => item.key === clickedItem.key)) {
        return;
    }
    return (e) => {
        this.setState({
            clicked: this.state.clicked.concat([item]),
            items: this.state.items.filter((x) => x.key != item.key)
        });
        console.log(item);
    }
}

如何使用react-spring处理消失元素的onclick？

1 个答案: