Как исправить проблему с зависимостями в useEffect? - PullRequest
0 голосов
/ 13 марта 2020

Мне нужно сделать запрос один раз, но появляется ошибка, связанная с зависимостями. Если я добавлю к зависимости, будет бесконечный l oop.

Что вы посоветуете сделать в этой ситуации?

enter image description here

код:

import React from "react";
import { useEffect } from "react";
import { useObjects } from "../../store/api";
import { connect } from "react-redux";
import { GetObjectsAC } from "../../store/ObjectRecucer";
import { Object } from "./Object";

let MapStateToProps = state => {
  return {
    currentObj: state.objReducer.CurrentObjects
  };
};
export let ObjectBlock = props => {
  const { request } = useObjects();
  useEffect(() => {
    const data = request("/api/objects").then(res => {
      props.GetObjectsAC(res.message);
    });
  }, []);
  const objBlock = props.currentObj.map((el, i) => (
    <Object key={i} street={el.street} home={el.home} />
  ));
  return <div>{objBlock}</div>;
};
export let ObjectContainer = connect(
  MapStateToProps,
  { GetObjectsAC }
)(ObjectBlock);

1 Ответ

0 голосов
/ 14 марта 2020

Что-то вроде этого разрешит предупреждение:

import React from "react";
import { useEffect } from "react";
import { useObjects } from "../../store/api";
import { connect } from "react-redux";
import { GetObjectsAC } from "../../store/ObjectRecucer";
import { Object } from "./Object";

let MapStateToProps = state => {
  return {
    currentObj: state.objReducer.CurrentObjects
  };
};
export let ObjectBlock = props => {
  const { request } = useObjects();
  const { GetObjectsAC, currentObj } = props; // destructure props
  useEffect(() => {
    const data = request("/api/objects").then(res => {
      GetObjectsAC(res.message);
    });
  }, [GetObjectsAC]); // Add value to deps array
  const objBlock = currentObj.map((el, i) => (
    <Object key={i} street={el.street} home={el.home} />
  ));
  return <div>{objBlock}</div>;
};
export let ObjectContainer = connect(
  MapStateToProps,
  { GetObjectsAC }
)(ObjectBlock);
...