如何通过外部接口使用useMemo？

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

const fetchExternalData = async () => {
  // 模拟外部接口请求
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve({ data: 'external data' });
    }, 1000);
  });
};

const MyComponent = () => {
  const [externalData, setExternalData] = useState(null);

  useEffect(() => {
    fetchExternalData().then((data) => {
      setExternalData(data);
    });
  }, []);

  const processedData = useMemo(() => {
    if (!externalData) return null;
    // 在这里处理外部接口的数据
    return externalData.data.toUpperCase();
  }, [externalData]);

  return (
    <div>
      {processedData ? (
        <p>Processed Data: {processedData}</p>
      ) : (
        <p>Loading...</p>
      )}
    </div>
  );
};

export default MyComponent;