Невозможно обновить состояние при отправке действия в редуктор - PullRequest
0 голосов
/ 14 января 2020

Я нахожусь на моем Home компоненте, где мне нужно показать канал статьи, и для этого у меня должен быть массив articleList . Но по какой-то причине, когда я заглядываю в магазин, articleList равен нулю. Кроме того, console.log , который я разместил после извлечения данных, также не работает. Все это кажется странным.

Home.js


import React, { Component } from "react"
import { connect } from "react-redux"
import { listAllArticles } from "../actions/articles"

class Home extends Component {

    componentDidMount() {
        this.props.dispatch(listAllArticles)
    }

    render() {
        console.log(this.props)
        return (
            <div style={{ textAlign: "center" }}>
                <h1>Conduit</h1>
                <h5>A place to share your knowledge</h5>
            </div>
        )
    }
}

const mapStateToProps = (state) => {
    return state
}

export default connect(mapStateToProps)(Home)
listAllArticles


export const listAllArticles = () => {
    console.log("inside listAllArticles action creator")
    return dispatch => {
        fetch("https://conduit.productionready.io/api/articles")
            .then(res => res.json())
            .then(data => {
                console.log(data.articles)
                dispatch({
                    type: "LIST_ALL_ARTICLES",
                    data: data.articles
                })
            })
    }
}
articleReducer


const initState = {
    articleList: null
}


export const articleReducer = (state=initState, action) => {
    console.log("inside article reducer")
    switch(action.type) {
        case "LIST_ALL_ARTICLES":
            return {...state, articleList: action.data}
        default:
            return state
    }
}
...