fargo
1a822493ba
963 markdown files reformatted with the repository's pinned prettier so pnpm format:check covers the folded tree like every other repo file. The formatter's embedded-language pass also normalized code fences (TS semicolons, closed HTML tags in examples, lowercased CSS hex colors, one renumbered list that skipped an index). Alphanumeric token deltas vs the fold commit were audited file-by-file; all are formatter-equivalent markup normalizations plus the four sanitized skills.
1.9 KiB
1.9 KiB
category
| category |
|---|
| Utilities |
createEventHook
Utility for creating event hooks
Usage
Creating a function that uses createEventHook
import { createEventHook } from '@vueuse/core';
export function useMyFetch(url) {
const fetchResult = createEventHook<Response>();
const fetchError = createEventHook<any>();
fetch(url)
.then((result) => fetchResult.trigger(result))
.catch((error) => fetchError.trigger(error.message));
return {
onResult: fetchResult.on,
onError: fetchError.on,
};
}
Using a function that uses createEventHook
<script setup lang="ts">
import { useMyFetch } from './my-fetch-function';
const { onResult, onError } = useMyFetch('my api url');
onResult((result) => {
console.log(result);
});
onError((error) => {
console.error(error);
});
</script>
Type Declarations
/**
* The source code for this function was inspired by vue-apollo's `useEventHook` util
* https://github.com/vuejs/vue-apollo/blob/v4/packages/vue-apollo-composable/src/util/useEventHook.ts
*/
type Callback<T> =
IsAny<T> extends true
? (...param: any) => void
: [T] extends [void]
? (...param: unknown[]) => void
: [T] extends [any[]]
? (...param: T) => void
: (...param: [T, ...unknown[]]) => void;
export type EventHookOn<T = any> = (fn: Callback<T>) => {
off: () => void;
};
export type EventHookOff<T = any> = (fn: Callback<T>) => void;
export type EventHookTrigger<T = any> = (...param: Parameters<Callback<T>>) => Promise<unknown[]>;
export interface EventHook<T = any> {
on: EventHookOn<T>;
off: EventHookOff<T>;
trigger: EventHookTrigger<T>;
clear: () => void;
}
export type EventHookReturn<T> = EventHook<T>;
/**
* Utility for creating event hooks
*
* @see https://vueuse.org/createEventHook
*
* @__NO_SIDE_EFFECTS__
*/
export declare function createEventHook<T = any>(): EventHookReturn<T>;