1---
2category: Utilities
3---
4 
5# createEventHook
6 
7Utility for creating event hooks
8 
9## Usage
10 
11Creating a function that uses `createEventHook`
12 
13```ts
14import { createEventHook } from '@vueuse/core'
15 
16export function useMyFetch(url) {
17  const fetchResult = createEventHook<Response>()
18  const fetchError = createEventHook<any>()
19 
20  fetch(url)
21    .then(result => fetchResult.trigger(result))
22    .catch(error => fetchError.trigger(error.message))
23 
24  return {
25    onResult: fetchResult.on,
26    onError: fetchError.on,
27  }
28}
29```
30 
31Using a function that uses `createEventHook`
32 
33```vue
34<script setup lang="ts">
35import { useMyFetch } from './my-fetch-function'
36 
37const { onResult, onError } = useMyFetch('my api url')
38 
39onResult((result) => {
40  console.log(result)
41})
42 
43onError((error) => {
44  console.error(error)
45})
46</script>
47```
48 
49## Type Declarations
50 
51```ts
52/**
53 * The source code for this function was inspired by vue-apollo's `useEventHook` util
54 * https://github.com/vuejs/vue-apollo/blob/v4/packages/vue-apollo-composable/src/util/useEventHook.ts
55 */
56type Callback<T> =
57  IsAny<T> extends true
58    ? (...param: any) => void
59    : [T] extends [void]
60      ? (...param: unknown[]) => void
61      : [T] extends [any[]]
62        ? (...param: T) => void
63        : (...param: [T, ...unknown[]]) => void
64export type EventHookOn<T = any> = (fn: Callback<T>) => {
65  off: () => void
66}
67export type EventHookOff<T = any> = (fn: Callback<T>) => void
68export type EventHookTrigger<T = any> = (
69  ...param: Parameters<Callback<T>>
70) => Promise<unknown[]>
71export interface EventHook<T = any> {
72  on: EventHookOn<T>
73  off: EventHookOff<T>
74  trigger: EventHookTrigger<T>
75  clear: () => void
76}
77export type EventHookReturn<T> = EventHook<T>
78/**
79 * Utility for creating event hooks
80 *
81 * @see https://vueuse.org/createEventHook
82 *
83 * @__NO_SIDE_EFFECTS__
84 */
85export declare function createEventHook<T = any>(): EventHookReturn<T>
86```
87