React 组件在单击按钮时不会重新渲染

问：

我有 1 个 React 组件（Register），当单击用户和删除按钮时，它为 Get（useGetUser） 和 DELETE（useDeleteUser） 方法调用 2 个 customHooks，但是当我单击删除按钮时，该组件不会重新渲染，只有在刷新页面时才会重新渲染。我该怎么办？

import { useEffect, useState } from "react";
import {Table, Button} from "react-bootstrap";
import "./register.css";
import useGetUser from "../customHooks/useGetUser";
import useDeleteUser from "../customHooks/useDeleteUser";


function Register(){    
   const [getUserData] = useGetUser("http://localhost:3000/userBase/")
   const [data,setData] = useState(null);
   const [delData,setDelData] = useState(null)
   const [deleteUser] = useDeleteUser(delData) 

   
    const userHandler=()=>{
        setData(getUserData)
    }

    const deleteHandler=(id)=>{
        deleteUser(id)
        userHandler(getUserData);
    }

             
    return( 
        <div>
            <div className="button-group">
                <Button variant="primary" className="btn">Add</Button>
                <Button variant="primary" className="btn" onClick={()=>userHandler()}>Users</Button>
            </div>
            <Table striped bordered hover>
                <thead>
                    <tr>
                        <th>Name</th>
                        <th>Email</th>
                        <th>Options</th>
                    </tr>
                </thead>
                <tbody>
                    {
                        data &&
                        data.map((user)=>{
                            return(
                                <tr>
                                    <td>{user.name}</td>
                                    <td>{user.mail}</td>
                                    <td>Update <Button variant="danger" onClick={()=>deleteHandler(user.id)}>Delete</Button></td>
                                </tr>
                            )
                        })
                    }
                   
                </tbody>
            </Table>
        </div>
        
    );
}

export default Register;

import { useEffect, useState } from "react";

function useDeleteUser(){
    const [data,setData] = useState("")
   // Accept the `id` parameter for deletion
    
    const deleteUser = async (id) => {
      try {
        const response = await fetch(`http://localhost:3000/userbase/${id}`, { method: "DELETE" });
          if (response.ok) {
            setData(`User with ID ${id} deleted successfully.`);
          } else {
            setData(`Failed to delete user with ID ${id}.`);
          }
      } catch (error) {
        console.error("Daniel, Error deleting user:", error);
        setData(`An error occurred while deleting user with ID ${id}.`);
      }
    };
    return [deleteUser, data];
}


export default useDeleteUser;

import { useEffect, useState } from "react";
import { responsivePropType } from "react-bootstrap/esm/createUtilityClasses";

function useGetUser(url){
    const [data,setData] = useState(null)
    useEffect(()=>{
        async function fetchData(){
            try{
                const response = await fetch(url)

                if(!response.ok){
                    throw new Error(`HTTP error! Status: ${response.status}`)
                }
                const responseData = await response.json();
                setData(responseData);
            }catch(error){
                console.log("Error fetching user data:", error)
            }
        }
        fetchData();
    },[])
    return [data];
    
}


export default useGetUser;

当我单击删除按钮时，注册组件应该重新渲染，就像我单击用户按钮时一样。