将SetTimeOut与React/redux调度函数一起使用时出错

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

const MyComponent = () => {
  const [data, setData] = useState([]);

  useEffect(() => {
    const timer = setTimeout(() => {
      // 执行相关操作
      setData([...data, 'new item']);
    }, 1000);

    return () => clearTimeout(timer); // 清除定时器

  }, [data]);

  return (
    <div>
      {/* 组件渲染内容 */}
    </div>
  );
};

// action.js
export const fetchData = () => {
  return dispatch => {
    const timer = setTimeout(() => {
      // 执行相关操作
      dispatch({ type: 'FETCH_DATA_SUCCESS', payload: { data: 'some data' }});
    }, 1000);

    return () => clearTimeout(timer); // 清除定时器
  };
};

// reducer.js
const initialState = {
  data: null,
};

const reducer = (state = initialState, action) => {
  switch (action.type) {
    case 'FETCH_DATA_SUCCESS':
      return { ...state, data: action.payload.data };
    default:
      return state;
  }
};