Optimizing fetch requests in react-redux?

Question

JavaScript

I'm using React-redux to create a SPA application. But the number of fetch requests to accept the API is huge, and it's impossible without optimization. I heard about ActionCreators, but I can't use it. Help create a template

// Actions
export function fetchAPI(dispatch, type_reducer, url) {
    dispatch (type_reducer());
    fetch('http://127.0.0.1:8000/api/v0/' + url)
            .then(function (response) {
                if(response.status !== 200) {
                    return;
                }
                response.json().then(json => json.length === 0 || undefined || null ? undefined : json.map(item => item)).then(item => dispatch(type_reducer(true, item)))
            })
}




export function selectFilter(request) {
    return (dispatch) => fetchAPI(dispatch, type_reducer=SelectFilter, url='filter' + request);
}

import {FILTER_CATEGORIES_REQUEST, FILTER_CATEGORIES_SUCCESS} from "../constans/Page";


// ActionCreators
export function SelectFilter(state, item) {
    if (state) {
        return {
            type: FILTER_CATEGORIES_REQUEST
        }
    } else {
        return {
            type: FILTER_CATEGORIES_SUCCESS,
            item
        }
    }
}

Answer 1

SelectFilter is not a reducer, it's an Action and you don't pass anything to it.
As far as I understood what you want to do:
the first time you use it before the request, i.e. export function SelectFilter(item)- item will be undefined, and you will return FILTER_CATEGORIES_REQUEST, then after the response you probably want to pull dispatch (type_reducer(response.data)); - we are already passing here, then export function SelectFilter(item) { if item we return

{
            type: FILTER_CATEGORIES_SUCCESS,
            item
        }

If I understand you correctly