当组件安装时,它会出现太多重新渲染错误

时间:2021-06-29 07:47:41

标签: reactjs react-hooks

我不知道为什么我会遇到这个问题“React:错误:重新渲染太多。React 限制渲染次数以防止无限循环”当组件第一次安装时,我使用 useEffect 钩子从 url 获取数据然后只将这些数据作为道具传递给子组件,别无其他。任何人都可以帮助我。非常感谢。

setMessage('')
const ProductDetail = ({ optionId, surveyText, allReviewsUrl, firstRateText }) => {
  const [reviewData, setReviewData] = useState({ ready: false });

  useEffect(() => {
    fetch('url', {
      method: 'POST',
      body: JSON.stringify({
        OptionId: optionId,
      }),
      headers: new Headers({
        'content-type': 'application/json',
      }),
    })
      .then((response) => response.json())
      .then((data) => {
        if (data.Count) {
          setReviewData({
            reviewCount: data.Data[0].TotalCommentCount,
            average: Math.round(data.Data[0].AverageStarScore * 10) / 10,
            percent: Math.round(data.Data[0].AverageStarScore * 20),
            reviewText: 'Değerlendirme',
            ready: true,
          });
        } else {
          setReviewData({ ready: true });
        }
      })
      .catch((error) => {
        console.error('Error while getting option summary:', error);
      });
  }, []);

  return (
    <ModalContextProvider>
      <InfoPanelReviews
        reviewData={reviewData}
        optionId={optionId}
        firstRateText={firstRateText}
        showAverage={false}
      />
      <ProductDetailReviews
        reviewData={reviewData}
        optionId={optionId}
        surveyText={surveyText}
        allReviewsUrl={allReviewsUrl}
      />
    </ModalContextProvider>
  );
};

0 个答案:

没有答案