InfiniteLoader和react-redux

eye*_*ick 7 react-redux react-virtualized

来自react-virtualised的组件InfiniteLoader 需要将属性loadMoreRows传递给具有签名的函数{ startIndex: number, stopIndex: number }): Promise.我在我的项目中使用redux,所以loadMoreRows是这样的redux动作创建者:

const fetchEntities(start, stop) {
  return fetch(`${myUrl}&start=${start}?stop=${stop}`)
}
const loadMoreRows = ({ startIndex, stopIndex }) => {
  return (dispatch, getState) => {
    return function(dispatch) {
      return fetchEntities(startIndex, stopIndex).then(
        items => dispatch(simpleAction(items)),
        error => console.log(error)
      )
    }
  }
}
Run Code Online (Sandbox Code Playgroud)

之后,使用react-redux中的connect函数将此操作连接到包含InfiniteLoader的react组件.

所以我不确定,我怎样才能满足签名要求,因为redux动作创建者不会返回任何值/

bva*_*ghn 2

eyeinthebrick是正确的。Promise 不是必需的返回值。

当您“连接”Redux 操作创建器时,调用它(分派它)实际上会返回一个 Promise。例如,我认为你可以做更多这样的事情......

function fetchEntities (start, stop) {
  return fetch(`${myUrl}&start=${start}?stop=${stop}`)
}

const loadMoreRows = ({ startIndex, stopIndex }) => {
  return async (dispatch, getState) => {
    try {
      const items = await fetchEntities(startIndex, stopIndex)
      await dispatch(simpleAction(items))
    } catch (error) {
      console.log(error)
    }
  }
}
Run Code Online (Sandbox Code Playgroud)

此时InfiniteLoader只需等待返回的 Redux Promise 即可。