React native Redux Saga action异步操作调用一次但触发两次

因此，我从我的react本机应用程序发送了一次redux saga操作，它进行了两次API调用。我正试图弄清楚为什么会这样，以及如何让它只发送一个

App.js

  const initFetch = async () => {
    const userToken = await AsyncStorage.getItem("userToken");
    dispatch(fetchLiked({ page: 0, search: "", userToken }));
  };

  useEffect(() => {
    initFetch();
  }, []);

configureStore.js

import { createStore, combineReducers, applyMiddleware } from "redux";
import { persistStore, persistReducer } from "redux-persist";
import AsyncStorage from "@react-native-community/async-storage";
import likedReducer from "./reducers/liked";
import createSagaMiddleware from "redux-saga";
import rootSaga from "./sagas/rootSaga";

const rootReducer = combineReducers({
  liked: likedReducer,
});

const persistConfig = {
  key: "primary",
  storage: AsyncStorage,
};

const persistedReducer = persistReducer(persistConfig, rootReducer);

const sagaMiddleware = createSagaMiddleware();

export default () => {
  let store = createStore(persistedReducer, applyMiddleware(sagaMiddleware));
  sagaMiddleware.run(rootSaga);
  let persistor = persistStore(store);
  return { store, persistor };
};

rootSaga.js

import { take, call, all } from "redux-saga/effects";
import { watchFetchLikedSaga } from "./likedSaga";

export default function* rootSaga() {
  yield all([watchFetchLikedSaga()]);
}

likedSaga.js

import { takeLatest, call, put } from "redux-saga/effects";
import Server from "../../utils/Server";
import { fetchLikedSuccess } from "./../actions/liked";
import { types } from "../actions/types";

function* asyncFetchLiked(data) {
  console.log("sending async fetch");
  const { page, search, userToken } = data.payload;
  try {
    const response = yield call(() =>
      Server.get("/api/titles/getliked", {
        headers: { "auth-token": userToken },
        params: { page: page, search: search },
      })
    );
    yield put(fetchLikedSuccess(response.data));
  } catch (e) {
    console.log(e);
  }
}

export function* watchFetchLikedSaga() {
  yield takeLatest(types.SEND_REQUEST, asyncFetchLiked);
}

导出常量=（数据）=>{ 返回{ 类型：types.SEND_请求， 有效载荷：数据， }; };

actions/liked.js

export const fetchLiked = (data) => {
  console.log("fetchLiked");
  return {
    type: types.SEND_REQUEST,
    payload: data,
  };
};

export const fetchLikedSuccess = (data) => {
  console.log("fetchLikedSuccess");
  return {
    type: types.SEND_REQUEST_SUCCESS,
    payload: data,
  };
};

export const fetchLikedFailure = (error) => {
  return {
    type: types.SEND_REQUEST_FAILURE,
    payload: {},
    error: error,
  };
};

我的console.log输出如下所示。您可以看到该操作只被调度一次，但它发送两个异步请求并调用reducer success操作两次

fetchLiked
sending async fetch
sending async fetch
fetchLikedSuccess
fetchLikedSuccess

---

您是否可能（由于复制或其他原因）对某些其他操作具有与类型相同的值。发送请求？我还将检查调用了多少次

watchFetchLikedSaga

，以防由于某种原因多次运行。谢谢Martin，问题是watchFetchLikedSaga被调用了两次，因为我的App.js被渲染了两次。是否可能是您不小心（由于复制或其他原因）某些其他操作的值与类型的值相同。发送请求？我还将检查调用了多少次

watchFetchLikedSaga

，以防由于某种原因多次运行。谢谢Martin，问题是watchFetchLikedSaga被调用了两次，因为我的App.js被渲染了两次。