mirror of
https://github.com/odoo/owl.git
synced 2025-10-06 19:59:41 +07:00
[IMP] hooks: add types to useEffect to improve DX
This commit is contained in:
committed by
Géry Debongnie
parent
412fda10fd
commit
9cc0f88e02
+13
-6
@@ -59,28 +59,35 @@ export function useChildSubEnv(envExtension: Env) {
|
|||||||
// useEffect
|
// useEffect
|
||||||
// -----------------------------------------------------------------------------
|
// -----------------------------------------------------------------------------
|
||||||
|
|
||||||
|
type EffectDeps<T extends any[]> = T | (T extends [...infer H, never] ? EffectDeps<H> : never);
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @param {...any} dependencies the dependencies computed by computeDependencies
|
* @template T
|
||||||
|
* @param {...T} dependencies the dependencies computed by computeDependencies
|
||||||
* @returns {void|(()=>void)} a cleanup function that reverses the side
|
* @returns {void|(()=>void)} a cleanup function that reverses the side
|
||||||
* effects of the effect callback.
|
* effects of the effect callback.
|
||||||
*/
|
*/
|
||||||
type Effect = (...dependencies: any[]) => void | (() => void);
|
type Effect<T extends [...T]> = (...dependencies: EffectDeps<T>) => void | (() => void);
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* This hook will run a callback when a component is mounted and patched, and
|
* This hook will run a callback when a component is mounted and patched, and
|
||||||
* will run a cleanup function before patching and before unmounting the
|
* will run a cleanup function before patching and before unmounting the
|
||||||
* the component.
|
* the component.
|
||||||
*
|
*
|
||||||
* @param {Effect} effect the effect to run on component mount and/or patch
|
* @template T
|
||||||
* @param {()=>any[]} [computeDependencies=()=>[NaN]] a callback to compute
|
* @param {Effect<T>} effect the effect to run on component mount and/or patch
|
||||||
|
* @param {()=>T} [computeDependencies=()=>[NaN]] a callback to compute
|
||||||
* dependencies that will decide if the effect needs to be cleaned up and
|
* dependencies that will decide if the effect needs to be cleaned up and
|
||||||
* run again. If the dependencies did not change, the effect will not run
|
* run again. If the dependencies did not change, the effect will not run
|
||||||
* again. The default value returns an array containing only NaN because
|
* again. The default value returns an array containing only NaN because
|
||||||
* NaN !== NaN, which will cause the effect to rerun on every patch.
|
* NaN !== NaN, which will cause the effect to rerun on every patch.
|
||||||
*/
|
*/
|
||||||
export function useEffect(effect: Effect, computeDependencies: () => any[] = () => [NaN]) {
|
export function useEffect<T extends [...T]>(
|
||||||
|
effect: Effect<T>,
|
||||||
|
computeDependencies: () => T = () => [NaN] as never
|
||||||
|
) {
|
||||||
let cleanup: (() => void) | void;
|
let cleanup: (() => void) | void;
|
||||||
let dependencies: any[];
|
let dependencies: T;
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
dependencies = computeDependencies();
|
dependencies = computeDependencies();
|
||||||
cleanup = effect(...dependencies);
|
cleanup = effect(...dependencies);
|
||||||
|
|||||||
Reference in New Issue
Block a user