I am finding myself in a rabbit hole lol. I am making a call to gett a list of objects and the call is successful, and I can see the data getting returned back. But I am not understanding why columnDefs is not getting updated with the success data.
defaultState = {
columnDefs: []
}
export default function MarketReducer(state = defaultState,action ){
switch (action.type){
case GET_MARKETING_LIST:
return Object.assign({}, state, {
columnDefs: [],
});
case GET_MARKETING_SUCCESS:
return Object.assign({}, state, {
columnDefs: action.payload.data.column_headers.columnDefs,
});
case GET_MARKETING_FAIL:
return Object.assign({}, state,{
error: action.error,
columnDefs: [],
});
default:
return state;
}
}
export function getMarketingProspects() {
return {
type: GET_MARKETING_LIST,
payload: {
request: {
url: "/marketing/customers",
method: "GET"
}
}
};
}
Then I have a button that is triggering getMarketingProspects(). Problem is that store is not getting updated.
The reason as to why it was not setting it to the store is because the actions were named different, i had to add "LIST" to success and failed, this then worked.
GET_MARKETING_LIST: GET_MARKETING_LIST_SUCCESS: GET_MARKETING_LIST_FAIL:
export function getMarketingProspects() {
return (dispatch) => {
dispatch({
type: GET_MARKETING_LIST,
payload: {
request: {
url: "/marketing/customers",
method: "GET"
}
}
})
}
}
now, on the action button you should dispatch the getMarketingProspects function. Like this.
onClick={()=> useDispatch(getMarketingProspects())}