Question

我正在尝试从mapDispatchToProps（mDTP）内访问容器的道具（从Redux状态传入）。我的容器负责调度一个操作以获取数据，但是它调度的操作需要访问一个redux状态。该状态将用作HTTP标头中的字段。

我尝试访问的redux状态是语言。然后我想将其作为标头传递给mDTP

这是我的容器：

const ExperienceListContainer = ({ list, loading, failed, readList, languages }) => {

  useEffect(() => {
    readList()
  }, [])

  const apiRequestParams = {
    endpoint: 'GetToursByCity',
    count: 10,
    step: 10,
    cityid: 'e2e12bfe-15ae-4382-87f4-88f2b8afd27a',
    startdate: '2018-12-20 8:30:00',
    enddate: '2018-12-20 22:15:00',
    sort_by: 'rating',
    guests: 10,
    min_price: 1,
    max_price: 100.50,
    time_of_day: 1,
    sort_by: 'rating',
    categories: '',
    languages: languages
  }

  return <ExperienceList {...{ list, loading, failed, languages }} />
}

ExperienceListContainer.propTypes = {
  list: T.arrayOf(T.object).isRequired,
  limit: T.number,
  loading: T.bool,
  failed: T.bool,
  readList: T.func.isRequired,
  filter: T.shape({
    interests: T.arrayOf(T.shape({
      id: T.number.isRequired,
      text: T.string.isRequired
    })),
    languages: T.arrayOf(T.shape({
      id: T.number.isRequired,
      text: T.string.isRequired
    })),
  }),
}

const mapStateToProps = state => {
  return (
    ({
      list: state.resource.experiences,
      languages: state.filter.languages
    })
  )
}

const mapDispatchToProps = (dispatch) => ({
  readList: () => {
    return (
      dispatch(resourceListReadRequest('experiences', { apiRequestParams }))
    )
  }
})

export default connect(mapStateToProps, mapDispatchToProps)(ExperienceListContainer)

此当前代码的问题是mDTP无法访问 apiRequestParams 。就其而言，它是未定义的。

根据我的研究，弹出的答案是使用mergeProps（作为传递给connect（）的arg）和ownProps（mapDispatchToProps包含的参数），但至少在我实现它们的方式。有没有更好的方法可以完成我想做的事情？

Answer 1

您必须像这样将它们传递给readList作为参数来访问它们： readList（apiParams）并像这样使用它们： readList：apiRequestParams => { 返回（ dispatch（resourceListReadRequest（'experiences'，{ apiRequestParams}）））这是因为apiRequestParams是容器本身的本地容器，无法在组件外部进行访问。

您还必须在useEffect上方声明它，并将其作为参数传递给useEffect，以便例如在语言更改时对其求值，并将引用保留为useRef或在useEffect中声明它，从而避免会导致无限循环。

希望有帮助。编码愉快。

将道具从Container传递到mapDispatchToProps

1 个答案: