CODEWITHSUNDEEP
javascriptreactjsreduxreact-redux
code.cycling
code.cycling

Reputation: 1274

Redux proper send of payload

I'm new to Redux. And I'm trying to create a simple FETCH_ALL_POSTS.

actions

export const fetchPosts = () => async dispatch => {
    const response = await jsonPlaceholder.get('/posts');
    console.log(response.data)
    dispatch({
       type: FETCH_ALL_POSTS,
       payload: response.data
    })
}

posts reducer

export default (state = {}, action) => {
const { type, payload } = action;
switch (type) {
    case FETCH_ALL_POSTS:
        return {
            ...state, payload
        }
    default:
        return state
}
}

post list component

const mapStateToProps = state => {
console.log(Object.values(state.posts))
return {
    posts: state.posts
}
}

This is working but the data that I'm getting from mapStateToProps is not what I'm expecting.

Result : "array: [ 0:[{},{},{}] ]"

My expected result: "array:[{},{},{}]"

Upvotes: 2

Views: 341

Answers (1)

user9846301
user9846301

Reputation:

Try this,

    const initialState = {
      posts: '',

    }
    export default (state=initialState, action) => {
    const { type, payload } = action;
    switch (type) {
        case FETCH_ALL_POSTS:
            return{
                posts:state.posts=action.payload.posts
           }
        default:
            return state
    }
}

Upvotes: 1

Related Questions