Я новичок в redux, пытаясь вызвать API и передать возвращенный массив объектов User в state.admin.users
.Redux: не удается обновить состояние после вызова API.
Мои коды: // компонент
class MyComponent extends Component {
componentWillMount() {
console.log('componentWillMount()');
this.props.fetchAllUsers();
}
render() {
return (
<div>
<ul>
{
this.props.users.map(function(user) {
return <div>user.email</div> })
}
</ul>
</div>
);
}
}
function mapStateToProps(state) {
console.log('state:' + JSON.stringify(state));
return {
users: state.admin.users
}
}
export default connect(mapStateToProps, {fetchAllUsers})(myComponent);
// редуктор
const INITIAL_STATE = { users:[] };
export default function (state = INITIAL_STATE, action) {
return { ...state, users:action.payload }; // Any problem here?
}
// действия
export function fetchAllUsers() {
return function(dispatch) {
axios.get(`${API_URL}/users`)
.then(response => {
console.log('response.data:' +JSON.stringify(response.data));
dispatch({
type: FETCH_ALL_USERS,
payload: response.data // Any problems here?
});
})
.catch(response => dispatch(errorHandler(response.data.error)))
}
}
консольный вывод
состояние: { "администратор": {}} bundle.js: 2570: 1
componentWillMount() bundle.js: 295: 8
ВАРИАНТЫ XHR http://myip:3001/api/users [HTTP/1.1 200 OK 2ms]
GET XHR http://myip:3001/api/users [HTTP/1.1 304 Not Modified 4ms]
response.data:[{data удалены} {данные удалены} {данные удалены}]
response.data исправны п или я. но какие-либо проблемы в вышеуказанных кодах? почему state.admin пуст? почему componentWillMount()
вызван после mapStateToProps
?
Любые комментарии приветствуются. Благодаря
кажется, что 'отправка ({ type: FETCH_ALL_USERS, грузоподъёмность: response.data }); – BAE
Попробуйте переписать код вашего обещания с кодом ошибки в качестве второго аргумента для 'then' вместо' catch'. https://github.com/facebook/react/issues/7617#issuecomment-247710003 –