所以我在我的项目中使用了useeffect，但由于某种原因它不起作用。任何人都知道我是否这样做了。它特别是useeffect没有触发。Console.log（“Hi”）确实触发了useeffect之外的任何地方。

const [openRequests, setOpenRequests] = useState([]);
  const [answeredRequests, setAnsweredRequests] = useState([]);
  const [closedRequests, setClosedRequests] = useState([]);
  const [assignments, setAssignments] = useState([]);
  const [CompleteAssignments, setCompleteAssignments] = useState<
    CompleteAssignment[]
  >([]);

  const [omzet, setOmzet] = useState<number>(0);
  const [vooruitzicht, setVooruitzicht] = useState<number>(0);

  const history = useHistory();

  const BTN_AS = document.getElementById("Opdrachten");
  const BTN_OP = document.getElementById("OpenAanvragen");
  const BTN_WE = document.getElementById("GeweigerdeAanvragen");
  const BTN_GE = document.getElementById("GeslotenOpenAanvragen");
  const OmzetText = document.getElementById("OmzetText");

  const hide = (ID: string) => {
    let x = document.getElementById(ID);
    switch (ID) {
      case "Opdrachten":
        if (x!.style.display === "none") {
          x!.style.display = "block";
          BTN_OP!.style.display = "none";
          BTN_WE!.style.display = "none";
          BTN_GE!.style.display = "none";
        } else {
          x!.style.display = "none";
        }
        break;
      case "OpenAanvragen":
        if (x!.style.display === "none") {
          x!.style.display = "block";
          BTN_AS!.style.display = "none";
          BTN_WE!.style.display = "none";
          BTN_GE!.style.display = "none";
        } else {
          x!.style.display = "none";
        }
        break;
      case "GeweigerdeAanvragen":
        if (x!.style.display === "none") {
          x!.style.display = "block";
          BTN_AS!.style.display = "none";
          BTN_GE!.style.display = "none";
          BTN_OP!.style.display = "none";
        } else {
          x!.style.display = "none";
        }
        break;
      case "GeslotenOpenAanvragen":
        if (x!.style.display === "none") {
          x!.style.display = "block";
          BTN_AS!.style.display = "none";
          BTN_WE!.style.display = "none";
          BTN_OP!.style.display = "none";
        } else {
          x!.style.display = "none";
        }
        break;
    }
  };

  useEffect(() => {
    async () => {
      console.log("hi");
      let completeAssignments: CompleteAssignment[] =
        await asyncCallApiByApiTag("getApiCompanyAanvragenGeslotenCompany");
      let openResults = await asyncCallApiByApiTag(
        "getApiCompanyRequestsOpenList"
      );
      let answeredResults = await asyncCallApiByApiTag(
        "getApiCompanyRequestsAnsweredList"
      );
      let closedResults = await asyncCallApiByApiTag(
        "getApiCompanyRequestsClosedList"
      );
      setOpenRequests(openResults);
      setAnsweredRequests(answeredResults);
      setClosedRequests(closedResults);
      setCompleteAssignments(completeAssignments);

      // console.log(CompleteAssignments);
      let result = await asyncCallApiByApiTag("getApiCompanyAssignmentsList");
      setAssignments(result);
      completeAssignments.map((result: any, index) => {
        completeAssignments.forEach((e) => {
          if (result["assignment"]["completedRequest"] == true) {
            console.log("brrrrrr");
            setOmzet(
              e["quotation"]["hoursPrice"] + e["quotation"]["materialPrice"]
            );
          }
        });
      });
      completeAssignments.map((result: any, index: number) => {
        completeAssignments.forEach((e: any) => {
          if (result["assignment"]["completedRequest"] == false) {
            console.log(completeAssignments);
            setVooruitzicht(
              e["quotation"]["hoursPrice"] + e["quotation"]["materialPrice"]
            );
          }
        });
      });
    };
  }, []);

这基本上应该做的是。从我的C#数据库中获取数据，并将其放入表中，在顶部显示东西的价格。除了useeffect之外，所有东西都呈现。所以现在整个功能都不工作了。

3条答案

按热度按时间

3gtaxfhh1#

如果要调用useEffect中的async函数，需要先定义它，然后再调用它，在您的示例中，似乎忘记调用它了

useEffect(() => {
   const fetch = async () => {
      // Your async code
      return []
   }
   fetch()
}, [])

赞(0）回复(0）举报 2023-03-01

68bkxrlz2#

您已经在useEffect中编写了一个函数，可能直接存在代码块，而不是另一个函数定义，或者至少存在一个IIFE。

kmb7vmvb3#

它正在执行。但是......它在做什么呢？去掉所有其他代码，useEffect函数包含以下结构：

async () => {
  console.log('hi');
};

它成功地执行了。但是它做了什么呢？它定义了一个匿名函数，但是这个函数永远不会被执行。所以你的代码成功地定义了一个函数。
假设您还想执行该函数，那么您可以将其设置为IIFE：

(async () => {
  console.log('hi');
})();

或者给函数一个名字，然后从这个名字调用它：

const myFunc = async () => {
  console.log('hi');
};
myFunc();

reactjs UseEffect未触发

3条答案

相关问题

热门标签

最新问答