Я работаю над приложением изоморфного реагирования, использующим избыточность, и получаю сообщение об ошибке, даже если этот же код работает с предыдущими модулями.
Здесь я выбираю данные через действие fetchMobile и обновляю данные магазина.
И функция loaddata используется для запуска dunction на сервере.
class MobilesList extends Component {
componentDidMount() {
this.props.fetchMobiles();
}
...
}
function mapStateToProps(state) {
// console.log(state); //i can get data in state
return { mobile: state.mobile };
}
function loadData(store,id) {
return store.dispatch(fetchMobiles());
}
export default {
loadData,
component: connect(mapStateToProps, { fetchMobiles,fetchMobilesPage })(MobilesList)
};
Ошибка, которую я получаю:
*Error-1 : The above error occurred in the <MobilesList> component:
in MobilesList (created by Connect(MobilesList))
in Connect(MobilesList) (created by Route)
in Route (created by App)
in Switch (created by App)
in div (created by App)
in App (created by Route)
in Route
in Switch
in div
in Router (created by BrowserRouter)
in BrowserRouter
in Provider
Consider adding an error boundary to your tree to customize error handling behavior.
You can learn more about error boundaries
Error-2 : Uncaught (in promise) TypeError: Cannot read property 'file' of undefined
at bundle.js:41672
at Array.map (<anonymous>)
at MobilesList.renderPosts (bundle.js:41659)
at MobilesList.render (bundle.js:41716)
at finishClassComponent (bundle.js:27178)
at updateClassComponent (bundle.js:27155)
at beginWork (bundle.js:27534)
at performUnitOfWork (bundle.js:29502)
at workLoop (bundle.js:29611)
at HTMLUnknownElement.callCallback*
функция renderPost
renderPosts() {
return this.props.mobile.map(single => {
return <div key={single.postId} className={"container"}><Link to={"/"+single.postSlug} slug={single.postSlug}>
<div class="card" >
<div class="card-image waves-effect waves-block waves-light">
<img class="activator" src={single.featuredImage.sizes.medium.file)}/>
</div>
<div class="card-content">
<span class="card-title activator grey-text text-darken-4">{single.postTitle}</span>
</div>
</div>
</Link>
</div> ;
});
}