Thunk 액션이 핵심 로직을 통해 실행되고 있지 않습니다. 나는 덤크 동작을 componentDidMount
에서부터 시작했으나 다음으로 실행하지 않습니다 : const response = await findOne(id)
.Thunk Action Body가 호출되지 않습니다.
또한, 나는 명시 적으로 mapDispatchToProps에 소품으로 dispatch를 전달할 필요가 없다고 생각했습니다. redux-thunk를 사용하는 경우, 제 썽크 설정이 발송물을 이미 사용할 수 있다고 생각합니까? 그리고 나는 이와 같은 다른 행동을 사용했습니다.
썽크 작업
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)
, 나는 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))
}
}
}
함수 개체를'connect'의'mapDispatchToProps' 매개 변수로 전달하면 각 함수는'dispatch'에 래핑되어'mapDispatchToProps'는 문제가되지 않습니다. 자세한 정보는 [docs on connect] (https://github.com/reactjs/react-redux/blob/master/docs/api.md#connectmapstatetoprops-mapdispatchtoprops-mergeprops-options)를 참조하십시오. – topher