Meteor.call in for each loop 在無限循環中運行

Question

流星新手在這里，我有一個列表循環，它對流星方法進行流星調用。 我需要將結果填充到另一個對象中，每個列表項作為鍵和值作為流星方法響應。 在所有與項目相關的流星調用完成返回響應后，我想最后打印完全更新的對象

這是我的以下代碼，它在無限循環中運行

  const [codeCoverage, setcodeCoverage] = useState({});
  projectList = ['proj1','proj2','proj3']
  projectList.map((project) => {
    Meteor.call(
      'sonarqb.getProjectStatus',
      { project },
      (error, resp) => {
        if (error) throw new Error(error);
        setCodeCoverage({...codeCoverage, [project] : val.actualValue })
      }
    )
  });

  useEffect(() => {
    console.log(codeCoverage);
  }, [codeCoverage]);

服務於上述調用的 Meteor 方法

Meteor.methods({
  'sonarqb.getProjectStatus'({ project }) {

    const options = {
      method: 'GET',
      url: `https://sonarqube.com/sonar/api/qualitygates/project_status?projectKey=${project}`,
      headers: {
        Authorization:
          'Basic <auth str>',
      },
    };

    const future = new Future();

    request(options, function(error, response) {
      if (error) throw new Error(error);
      const sonarResponse = JSON.parse(response.body);
      future.return(sonarResponse);
    });
    return future.wait();
  },
});

Answer 1

假設這是一個 React 函數組件，問題是每次組件渲染時都會發生Meteor.call ，包括每次調用setCodeCoverage ，即每次調用完成時——因此是一個無限循環。

您需要將Meteor.call包裝在useEffect （或其他東西）中，而不是將它們放在組件的頂層。 如果您希望它們在組件的開頭只發生一次：

  const [codeCoverage, setcodeCoverage] = useState({});
  const projectList = ['proj1','proj2','proj3'];
  useEffect(() => {
    projectList.forEach((project) => {
      Meteor.call(
        'sonarqb.getProjectStatus',
        { project },
        (error, resp) => {
          if (error) throw new Error(error);
          setCodeCoverage((previous) =>
            {...previous, [project] : val.actualValue });
        }
      )
    })
  }, []); // no deps => run once at beginning

  useEffect(() => {
    console.log(codeCoverage);
  }, [codeCoverage]);