在商店更新之前反应Redux-超时

我正在努力将带有动漫js的动画放入我的React Redux应用程序中。我在商店中有一个通知对象,当用户单击“删除”时,通知将被删除,商店也将更新。但是,我需要等待几百毫秒才能播放淡出动画。我尝试在致电之前设置超时时间,但是没有运气。

handleDeleteNoti = notification => {
    setTimeout(()=>{
        anime({
        targets: this.notiRef,
        opacity: [1,0],
        duration: 5000,
        })
    }, 5000);
    this.props.clearNotification(notification._id);
}

我也尝试在减速器中设置超时,也没有成功。

case CLEAR_NOTIFICATION:
    const newData = state.data.filter(notification=>notification._id!==action.payload);
    setTimeout(()=>{
        return {
            ...state, 
            data: newData
        }}, 400);

我想我的问题真的可以归结为一个反向setTimeout,在超时发生时调用该函数。有什么办法解决这个问题?谢谢!

Also, I have my animation in componentWillUnmount

评论
w无意
w无意

答案实际上非常简单,我只是调用了动画,并设置了一个超时时间,直到调用该动作为止:

handleDeleteNoti = notification => {
    anime({
        targets: this.notiRef,
        opacity: [1,0],
        duration: 500,
    });

    setTimeout(()=>{this.props.clearNotification(notification._id)}, 5000)
    // this.props.clearNotification(notification._id);
}
点赞
评论