Not working pagination ref paramter with refetch

export default function useUserQuery() {
  const queryClient = useQueryClient();
  const searchQuery = ref<UserSearchQuery>({
    page: 1,
    limit: 10
  });
  const { data, isLoading, isError, isFetching, refetch } = useQuery<PayloadUser>(
    [QueryKey.User],
    () => getData(searchQuery.value).then((res) => res.data),
    {
      keepPreviousData: true,
    }
  );

  return {
    searchQuery,
    data,
    isLoading,
    isFetching,
    isError,
    refetch
  };
}

export default function useUserQuery() {
  const queryClient = useQueryClient();
  const searchQuery = ref<UserSearchQuery>({
    page: 1,
    limit: 10
  });
  const { data, isLoading, isError, isFetching, refetch } = useQuery<PayloadUser>(
    [QueryKey.User],
    () => getData(searchQuery.value).then((res) => res.data),
    {
      keepPreviousData: true,
    }
  );

  return {
    searchQuery,
    data,
    isLoading,
    isFetching,
    isError,
    refetch
  };
}

<script lang="ts" setup>
import useUserQuery from "@/composables/useUserQuery";

const { searchQuery, isLoading, data, isFetching, refetch } = useUserQuery();
const currentPageChange = (page) => {
  searchQuery.value.page = page;
  refetch()
};

const itemsPerPageChange = (limit) => {
  searchQuery.value.limit = limit;
  refetch()
};
</script>
<template>
....
</template>

<script lang="ts" setup>
import useUserQuery from "@/composables/useUserQuery";

const { searchQuery, isLoading, data, isFetching, refetch } = useUserQuery();
const currentPageChange = (page) => {
  searchQuery.value.page = page;
  refetch()
};

const itemsPerPageChange = (limit) => {
  searchQuery.value.limit = limit;
  refetch()
};
</script>
<template>
....
</template>