我正在尝试停止执行此mutate函数。在我调用List.js中的mutate（）之后，当我在浏览器中检查网络时，我可以看到mutate始终在执行。我需要执行一次。这是我输出数据的List.js。

import React, {useEffect} from 'react';
import ListItem from './ListItem'
import FetchData from './FetchData';

    function List() {
      const {
        data,
        loading,
        mutate,
      } = FetchData();
    
      //this needs to stop using interval how?
      mutate();
    
      return (
        <ul>
          {loading && <div>Loading</div>}
          {!loading && (
            <>
              {data.map(item => (<ListItem key={item.id} id={item.id} name={item.name} complete={item.complete} />))}
            </>
          )}
        </ul>
      )
    }
    
    export default List

这是FetchData.js，变异的地方在这里。

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

const FetchData = () => {
  const [data, setData] = useState({});
  const [loading, setLoading] = useState(true);

  const fetchData = async () => {
    try {
      const { data: response } = await axios.get(
        "http://localhost/todolistci/backend/index.php/todos/view",
        { crossDomain: true }
      );
      setData(response);
    } catch (error) {
      console.error(error);
    }
    setLoading(false);
  };

  const mutate = () => fetchData();

  useEffect(() => {
    fetchData();
  }, []);

  return {
    data,
    loading,
    mutate,
  };
};

export default FetchData;

我无法停止执行mutate，我需要它停止使用interval如何？这是应用程序的图像。enter image description here