在第二次按下按钮之前，事件无法正确触发

Question

检查了所有相关问题，很遗憾找不到与我的问题相似的问题。

我有一组映射到表中的用户对象。每个用户ID的旁边是一个删除按钮，当按下该按钮时，我会触发一个事件以从阵列中删除该用户。

[我尝试向按钮添加第二个onClick函数，首先声明用户对象是什么，然后触发移除，我也尝试过e.stopPropagation（）认为可能没有正确冒泡。

const UsersTable = ({ users, setUsers, callback }) => {
    const [selectedUser, setSelectedUser] = useState(null);
    const removeUser = user => {
        setSelectedUser(user)
        callback(user)
    };

    return (
        {
            users.map(user => 
                <div className="userRow">
                    <div className="deleteButton" onClick={()=> removeUser(user)}>
                        {user.name}
                    </div>
                </div>
            )
        }
    )
};

如果我使用已定义的用户运行回调，它将正常工作。但是，在使用此功能时，第一次单击该按钮时，出现一个错误，提示用户不能为null，第二次按下时，它将正确触发。我做错了什么吗？为什么第一次按时它不能正常工作。

Answer 1

我认为这可能是同步问题。代替在callback内部运行removeUser，请尝试将其放入useEffect。 https://reactjs.org/docs/hooks-effect.html