搜索

首页  >  问答  >  正文

超出最大更新深度。 React 限制嵌套更新的数量以防止无限循环。问题

我正在尝试使用react-table库,但我遇到了这个问题,我不知道如何解决它。

未捕获错误:超出最大更新深度。当组件在 componentWillUpdate 或 componentDidUpdate 中重复调用 setState 时,可能会发生这种情况。 React 限制嵌套更新的数量以防止无限循环。

export const GetProducts=async()=>{
    try {
        const response=await axios({
            url:`${baseUrl}/products`,
            method:"GET"
          })

          // console.log(response.data.products)
          return await response.data.products
    } catch (error) {
        console.log(error.response)
    }
}

我正在尝试这个:

const TablaStock = () => {
  const [data, setData] = useState([]);


  useEffect(() => {
    const getProducts = async () => {
      const response = await GetProducts();
      setData(response.products);
    };

    getProducts();
  }, [data]);


  const columns =useMemo(() =>  [
    { Header:"CODIGO",
      accessor: "codigo"
     },
    { Header:"PRENDA",
      accessor: "prenda" },
    { Header:"MARCA",
      accessor: "marca" },
    { Header:"CATEGORIA",
      accessor: "categoria" },
    { Header:"TALLE",
      accessor: "" },
    { Header:"CLIENTE",
      accessor: "cliente" },
    { Header:"FECHA DE INGRESO",
      accessor: "fechaIngreso" },
    { Header:"PRECIO DE VENTA",
      accessor: "precioVenta" },
    { Header:"GANANCIA CLIENTE",
      accessor: "" },
    { Header:"GANCANIA FERNANDEZ SHOP",
      accessor: "",
      Cell:({})},
    { Header:"ESTADO",
      accessor: "estado" },
    { Header:"TIEMPO EN VENTA",
      accessor: "tiempoEnVenta" },
  ]);

  const table=useTable({
    columns,
    data })

   

  return (
  <>
  </>
  );
};

export default TablaStock;

P粉218775965P粉218775965262 天前339

全部回复(2)我来回复

  • P粉465675962

    P粉4656759622024-02-26 09:24:36

    您使用Effect进入无限循环,因为您从服务器获取“数据”,但也通过该变量的cahnge重新渲染。 从 useEffect 的依赖列表中删除“data”:

    useEffect(() => {
        const getProducts = async () => {
          const response = await GetProducts();
          setData(response.products);
        };
    
        getProducts();
      }, []); // Remove the 'data' dependency

    希望对您有所帮助。

    回复
    0
  • P粉674757114

    P粉6747571142024-02-26 00:44:31

    我通过添加以下代码解决了这个问题:

    const table = useTable({
      columns,
      data,
      autoResetHiddenColumns: false, //  <-- stops the rerendering
      autoResetSortBy: false, //  <-- stops the rerendering
    });

    回复
    0
  • 取消回复