Всем привет
не могу никак разобраться со store
в стейт все диспатчит, но получить стейт в компоненте я не могу
Как я понял все дело в том что диспатч происходит после того как компонент запрашивает сдейт, а он еще пустой
Подскажите как решить пж
Компонент
import React, { Component } from 'react';
//import { Link } from 'react-router-dom'
import { connect } from 'react-redux'
import { apiData } from '../actions'
import { bindActionCreators } from 'redux';
import Head from './Head'
class Post extends Component {
constructor(props) {
super(props)
}
componentWillMount() {
let type = this.props.match.params.posts;
this.props.apiData(type)
//console.log(this.props.apiData(type))
}
componentDidMount() {
console.log(this.props)
}
render() {
let posts = this.props
if (posts && posts == 'undefained') {
return (
<div className="head">
<div>
<Head />
</div>
{ }
</div>
)
} else {
return (
<div className="head">
<div>
<Head />
</div>
<p>Loading...</p>
</div>
)
}
}
}
const mapDispatchToProps = (dispatch) => {
return bindActionCreators({apiData}, dispatch);
}
const mapStateToProps = (store) => {
return {
data: store.data
};
}
export default connect(mapStateToProps, mapDispatchToProps)(Post)
action
import axios from 'axios'
import item from '../reducer';
const someData = (data) => {
return {
type: "DATA_FROM_API",
data: data
}
}
export const apiData = (typePage) => {
return (dispath) => {
axios.get('https://jsonplaceholder.typicode.com/' + typePage)
.then(res => dispath(someData(res.data)))
.catch(err => {
console.log(err)
})
}
}
reducer
const item = (state = [], action) => {
switch (action.type) {
case "DATA_FROM_API":
return {
...state,
data: action.data
}
// case "FETCH_API_ERROR":
// return {
// ...state,
// error: action.err
// }
default:
return state
}
}
export default item
Простой