Question

我目前正在创建一个通知react组件，并且试图弄清围绕它的逻辑，即在设定的时间后关闭/自动关闭。

基本上-显示通知后，运行autoCloseAction()函数。如果5秒钟后用户将鼠标悬停在通知中，则不会呼叫closeAction()。

但是，这并不像我希望的那样牢固。必须将用户悬停在closeAction dispatch的5秒标记处。当您查看代码时，这很有意义。

也-如果强制关闭通知，请单击“ x”按钮-超时仍会继续。因此，如果用户足够快地打开另一个通知，则它可以在超时结束后立即关闭。

所以我想我正在寻找一种方法来取消我的派遣，或者覆盖我的派遣以防止发生冲突。

任何帮助都会非常有用，因为我正在努力解决这种情况！

非常感谢！

export function openAction() {
    return dispatch => {
        dispatch([{ type: OPEN }, autoCloseAction()]);
    };
}

export function closeAction() {
    return {
        type: CLOSE
    };
}

export function autoCloseAction() {
    return dispatch => {
        dispatch({ type: AUTO_CLOSE });

        setTimeout(() => {
            if (!store.getState().mouseIn) {
                dispatch(closeAction());
            }
        }, 5000);
    };
}

Answer 1

setTimeout返回一个ID。您可以使用该ID清除超时。在您的代码中，您可以获得ID并将其传递给您的“ AUTO_CLOSE”操作，并将其保存在redux存储中。然后，如果用户单击“ x”，则可以从商店中检索ID并通过“ clearTimeout”清除超时。

关于悬停问题，我尚未完全理解您的问题。

禁止在超时功能中调度

1 个答案: