如何在使用ReactQuery useMutation创建新组时更新组数组

import { useMutation, queryClient } from 'react-query';

const createGroup = async (newGroupData) => {
  // 发送请求到服务器创建新组
  const response = await fetch('/api/groups', {
    method: 'POST',
    body: JSON.stringify(newGroupData),
    headers: {
      'Content-Type': 'application/json',
    },
  });

  const data = await response.json();

  return data;
};

const GroupList = () => {
  const mutation = useMutation(createGroup, {
    onSuccess: () => {
      // 更新组数组数据
      queryClient.setQueriesData('groups', (oldData) => [...oldData, newGroupData]);
    },
  });

  const handleCreateGroup = () => {
    const newGroupData = { name: 'New Group' };

    mutation.mutate(newGroupData);
  };

  return (
    <div>
      <button onClick={handleCreateGroup}>创建新组</button>
    </div>
  );
};