redux-saga效果中的无限循环

Question

我已经能够创建一个无限循环，不断从API获取数据。

我使用useEffect条件调度来运行，它应该只运行一次。

但是当我查看Redux DevTools时，从api中检索数据是一个无休止的循环。

片:

import { createSlice } from "@reduxjs/toolkit";
const initialState = { cats: [] };
const catSlice = createSlice({
name: "cat",
initialState,
reducers: {
setCat: (state, action) => {
state.cats = action.payload;
},
},
});
export const { setCat } = catSlice.actions;
export default catSlice.reducer;

传奇:

import { call, put, takeLatest } from "redux-saga/effects";
import { setCat } from "./catSlice";
function* getCatsFetch() {
const cats = yield call(() => fetch(`https://xxxapi.com`));
const formatedCats = yield cats.json();
yield put(setCat(formatedCats));
}
function* catSaga() {
yield takeLatest("cat/setCats", getCatsFetch);
}
export default catSaga;

App.js中的命令

useEffect(() => {
dispatch(setCats());
}, [dispatch]);

你能帮我停止对api的无休止的请求吗?由于

Answer 1

问题是您的getCatsFetchsaga发出setCat动作。你的catSaga正在等待任何setCat触发另一个getCatsFetch的传奇。因此，即使您只从组件调度一个setCat动作，saga在成功运行后也会发出一个setCat。您正在遍历中间件。

要纠正这个问题，您可能应该将takeLatest更改为寻找某种getCats动作，然后在组件中发出该动作。(不是你的传奇)。