javascript - redux useDispatch-不断刷新页面

当我在useDispatch中使用useEffect时，它会不断重新加载整个组件

这是我的动作：

export const getData = () => dispatch => {

    fetch("https://jsonplaceholder.typicode.com/users")
      .then((response) => response.json())
      .then((json) =>
        json.map((obj) => ({
          ...obj,
          bonus: 1500,
          remaining: 230,
          active: Math.floor(Math.random() * 2) === 1 ? "yes" : "no",
        }))
      )
      .then((response) =>
        dispatch({ type: constants.REQUEST_PLAYERS_SUCCESS, payload: response })
      )
      .catch( error => dispatch({type: constants.REQUEST_PLAYERS_FAILED, payload: error}))
};

这是我的减速机：

const initialState = {
  data: [],
  isLoading: false,
};

export const changeGridData = (state = initialState, action = {}) => {
  switch (action.type) {
    case constants.REQUEST_PLAYERS_PENDING:
      return { ...state, isLoading: true };
    case constants.REQUEST_PLAYERS_SUCCESS:
      return { ...state, data: action.payload, isLoading: false};
    case constants.REQUEST_PLAYERS_FAILED:
      return { ...state, isLoading: false };
    default:
      return state;
  }
};

这是组件：

import React, { useState, useEffect } from "react";
import { getData } from "../store/gridPlayersLoad/gridPlayersActions";
import { useDispatch, useSelector } from "react-redux";

const Bonuses = () => {
 const content = useSelector((state) => state);
 const dispatch = useDispatch();

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

 // Some other code...
}

它不断重新加载的原因可能是什么？

最佳答案

根据提供的内容，useEffect和useDispatch的实现没有任何问题。

无论是什么引起您的意外刷新，都必须由受Redux状态更改影响的应用程序中较高的组件引起。

当订阅redux状态的包装组件发生状态更改时，它将重新呈现。这可能会导致安装/卸载组件的更改。

在您的情况下，是导致路由器被重新安装的原因，这意味着带有useEffect钩子的路由中的所有组件都将再次运行那些安装效果。