useMemo内部的异步函数不起作用

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

function MyComponent({ data }) {
  const [result, setResult] = useState(null);

  useEffect(() => {
    async function fetchData() {
      // 异步操作
      const response = await fetch('https://api.example.com/data');
      const data = await response.json();
      setResult(data);
    }

    fetchData();
  }, [data]);

  const memoizedResult = useMemo(() => {
    // 对结果进行处理
    if (result) {
      return result.map(item => item.name);
    }
    return [];
  }, [result]);

  return (
    <div>
      {memoizedResult.map(name => (
        <div key={name}>{name}</div>
      ))}
    </div>
  );
}