return 来自 thunk 的承诺

Question

我正在尝试在 redux-thunk 中使用我的第一个 thunk：

让 redux-thunk 进入我已经使用 redux-observable 的应用程序：

import thunk from 'redux-thunk'

export const store = createStore(
  rootReducer,
  vepo,
  composeWithDevTools(applyMiddleware(createEpicMiddleware(rootEpic), thunk))
)

像这样使用它：

动作创作者：

export const updateShowProductIsVeganModal = (payload: boolean) => {
  return function (dispatch) {
    return new Promise((resolve, reject) => {
      dispatch({
        type: 'UPDATE_INSPECTION_SHOW_PRODUCT_IS_VEGAN_MODAL',
        payload
      })
      resolve()
    })
  }
}

然后我有这个组件（它更大，我已经把它剥离了这个问题）：

const veganPress = (props, refs) => {
  props.updateShowProductIsVeganModal(true).then(() => {
    console.log("plz work")
    refs.toast.show('hello world!')
  })
}

class ProductDetailsView extends Component<any, State> {
  render = () => {
    return (
       <Button onPress={() => veganPress(this.props, this.refs)}>
       <Toast ref="toast"/>
    )}
}

const mapDispatchToProps = (dispatch: Dispatch<*>): any => ({
  updateShowProductIsVeganModal: (show: boolean) => {
    dispatch(updateShowProductIsVeganModal(show))
  }
})

const view = connect(
  mapStateToProps,
  mapDispatchToProps
)(ProductDetailsView)

我收到错误：

ExceptionsManager.js:63 Cannot read property 'then' of undefined

指的是veganPress()里面的.then

return 一个可以使用 .then 的 promise 如何实现？

Answer 1

updateShowProductIsVeganModal 不 return 承诺。改成

const mapDispatchToProps = (dispatch: Dispatch<*>): any => ({
  updateShowProductIsVeganModal: (show: boolean) => {
    return dispatch(updateShowProductIsVeganModal(show))
  }
})

return 来自 thunk 的承诺

return promise from thunk

reactjs

react-native

redux-thunk

react-redux