useCached

Category

Utilities

Export Size

159 B

Last Changed

5 days ago

Cache a value with a custom comparator

Demo

Usage

import { useCached } from '@reause/core'
import { useState } from 'react'

interface Data {
  value: number
  extra: number
}

const [source, setSource] = useState<Data>({ value: 42, extra: 0 })
const cached = useCached(source, (newSourceValue, cachedValue) => newSourceValue.value === cachedValue.value)

setSource({ value: 42, extra: 1 })
console.log(cached) // { value: 42, extra: 0 } — only `value` is significant

setSource({ value: 43, extra: 1 })
console.log(cached) // { value: 43, extra: 1 } — significant change, cache follows

Type Declarations

export type UseCachedComparator<T> = (newSourceValue: T, cachedValue: T) => boolean

export function useCached<T>(source: T, comparator?: UseCachedComparator<T>): T

Source

Source · Demo · VueUse

Contributors

Changelog

v0.1.0 on

5cbe9 - fix(core): resolve useCached audit findings (#522)

6373b - fix(core): repair pre-existing main test regressions

99abe - feat(core): add useCached (#88)