javascript - 未调用Thunk Action 主体

我的重击动作似乎并没有贯穿其核心逻辑。我高举了componentDidMount的重击动作，但这并不会导致它运行：const response = await findOne(id)。

另外，我认为如果使用redux-thunk，则不需要显式传递dispatch作为对mapDispatchToProps的支持，我认为我的thunk设置方式是该thunk已经可以使用dispatch？而且我还使用了其他类似的操作，效果很好，为什么不这样做呢？

重击动作

export function fetchCompany(id) {
  return async (dispatch) => {

    try {
      const response = await findOne(id)

      if(response && response.body) {
        const company = response.body
        dispatch(companyReceived(company))
      }
    } catch(err) {
      console.log("failed request in authenticate thunk action")
      console.log(`error details: ${err.status} /n ${err}`)
    }
  }
}

容器
......

import { fetchCompany } from '../../client/actions/company/CompanyAsyncActions'

class InterviewContainer extends Component {
  async componentDidMount() {
    await fetchCompany(this.props.params.companyId)
  }

  render(){
    return (this.props.company && <Interview className='ft-interview' company={this.props.company} />)
  }
}

const mapStateToProps = state => ({
  company: state.company.company
})

const mapDispatchToProps = {
  fetchCompany: fetchCompany
}

export default connect(mapStateToProps, mapDispatchToProps)(InterviewContainer)

过去，我没有通过（dispatch）作为mapDispatchToProps的道具，并且效果很好。但是我看到其他所有人都在这样做。如果我不这样做，过去的代码将如何工作？为什么在上面的示例中这一次不起作用？

看一下另一个异步动作重排容器和调用示例，这完全可以正常工作，我在另一个容器中以相同的方式调用它

容器

class HomePageContainer extends Component {
  constructor(){
    super()
  }

  async componentDidMount() {
    await this.props.fetchFeaturedCompanies()
    await this.props.fetchCompanies()
    await this.props.fetchCountries()
  }

  render(){
    return (<HomePage className='ft-homepage'
                      featuredCompanies={this.props.featuredCompanies}
                      countries={this.props.countries}
                      companies={this.props.companies}
    />)
  }
}

const mapStateToProps = state => ({
  countries: state.country.countries,
  companies: state.company.companies,
  featuredCompanies: state.company.featuredCompanies
})

const mapDispatchToProps = {
  fetchCountries: fetchCountries,
  fetchCompanies: fetchCompanies,
  fetchFeaturedCompanies: fetchFeaturedCompanies
}

export default connect(mapStateToProps, mapDispatchToProps)(HomePageContainer)

重击动作

export function fetchCompanies() {
  return async (dispatch, getState) => {
    const response = await find()

    if(response && response.body) {
      const companies = response.body
      dispatch(companiesReceived(companies))
    }
  }
}

最佳答案

在componentDidMount的InterviewContainer中，您不小心调用了导入的fetchCompany，而不是this.props.fetchCompany。

关于javascript - 未调用Thunk Action 主体，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/46517041/