等待 redux操作完成调度

我有以下动作创建者:

我有以下动作创建者:

export function scrolltoNextItem(item) {
  return (dispatch, getState) => {
    dispatch(appendItem(Item));
    dispatch(
      scrollToNextIndex(
        getState().items.length - 1
      )
    )
  }
}

问题是scrollToNextItem在 appendItem 完成之前运行,并且滚动位置最终不正确。我可以通过添加setTimeout来证明这是这种情况,以使脚本的执行在运行scrollToNextItem之前等待下一个滴答:

export function scrolltoNextItem(item) {
  return (dispatch, getState) => {
    dispatch(appendItem(Item));
    setTimeout(() => {
      dispatch(
        scrollToNextIndex(
          getState().items.length - 1
        )
      )
    }, 0);
  }
}

如何等待appendItem操作完成?在标准反应土地上,我只使用setState回调:

this.setState({something: 'some thing'}, () => {
  console.log('something is set');
});

但是dispatch不提供任何回调功能。

15

您始终可以将 appendItem 包装到 promise 中,并将dispatch作为参数传递给它

const appendItem = (item, dispatch) => new Promise((resolve, reject) => {
  // do anything here
  dispatch(<your-action>);
  resolve();
}

然后你可以从scrolltoNextItem这样调用它

export function scrolltoNextItem(item) {
  return (dispatch, getState) => {
    appendItem(Item, dispatch).then(() => {
      dispatch(
        scrollToNextIndex(
          getState().items.length - 1
        )
      )
    })
  }
}

本站系公益性非盈利分享网址,本文来自用户投稿,不代表码文网立场,如若转载,请注明出处

(370)
一次只展开一个折叠 (material-ui)-React
上一篇
CSS媒体查询断点
下一篇

相关推荐

发表评论

登录 后才能评论

评论列表(11条)