如何在axios调用React后强制孩子重新渲染？

import React, { useState, useEffect } from 'react';
import axios from 'axios';

function ParentComponent() {
  const [forceRender, setForceRender] = useState(false);

  useEffect(() => {
    axios.get('api/data')
      .then(response => {
        // 处理响应数据
        // 更新状态变量，强制孩子重新渲染
        setForceRender(prevState => !prevState);
      })
      .catch(error => {
        // 处理错误
      });
  }, []);

  return (
    <div>
      <ChildComponent forceRender={forceRender} />
    </div>
  );
}

function ChildComponent({ forceRender }) {
  useEffect(() => {
    // 监听状态变量的变化，当forceRender发生变化时，触发重新渲染
    // 这里可以执行一些需要重新渲染的操作
  }, [forceRender]);

  return (
    <div>
      {/* 孩子组件的内容 */}
    </div>
  );
}