Спам запросов в redux-saga

При таком коде с redux-saga идет спам get запросов. Вместо одного их очень много

reducer.js:

const initialState = {
    popularVideos: [],
};

const videosReducer = (state = initialState, action) => {
    switch (action.type) {
        case POPULAR_VIDEOS_LIST: {
            return {
                ...state,
                popularVideos: action.popularVideos,
            }
        }
        default:
            return state
    }
};

export const getPopularVideosListAC = (popularVideos) => {
    return {type: POPULAR_VIDEOS_LIST, popularVideos}
};

saga.js:

function getData() {
    return api.getPopularVideosList()
        .then(res => {
            res.data.items.map(item => {
                let urlImage = `https://www.youtube.com/embed/${item.id}?controls=2`;
                return <div className="item-wrapper" key={item.id}>
                    <li className="title-popular-video">
                        <div className="wrapper-title-video"><span> {item.snippet.title} </span></div>
                        <iframe width="300" height="200" src={urlImage} frameBorder="0" title="myFrame"></iframe>
                        <div className="views"> views: {item.statistics.viewCount} </div>
                        <div className="statistics">
                            <div> like: {item.statistics.likeCount}  </div>
                            <div> dislike: {item.statistics.dislikeCount}  </div>
                        </div>
                    </li>
                </div>
            });

        })
}

function* workerLoadData() {
    let data = yield call(getData)
    yield put(getPopularVideosListAC(data))
}

export function* watchLoadData() {
    yield takeEvery(POPULAR_VIDEOS_LIST, workerLoadData)
}

api.js:

import axios from "axios";

const API_KEY = "----------------";
const instance = axios.create({
    baseURL: `https://www.googleapis.com/youtube/v3/videos?part=snippet%2CcontentDetails%2Cstatistics&chart=mostPopular&maxResults=5&key=${API_KEY}`
});

export const api = {
    getPopularVideosList() {
        return instance.get("", {})
    },
};

store.js:

const sagaMiddleware = createSagaMiddleware();
const rootReducer = combineReducers({
    news: newsReducer,
    videos: videosReducer,
    found_videos: foundVideosReducer
});

const store = createStore(rootReducer, applyMiddleware(sagaMiddleware));

sagaMiddleware.run(watchLoadData);

export default store;


Ответы (0 шт):