Skip to content

useCached

Category
Export Size
169 B
Last Changed
3 years ago

使用自定义比较器缓存一个 ref。

Demo

Value: 42
Extra: 0
Cached Value: 42
Cached Extra: 0

使用方法

ts
import { useCached } from '@vueuse/core'

interface Data {
  value: number
  extra: number
}

const source = ref<Data>({ value: 42, extra: 0 })
const cached = useCached(source, (a, b) => a.value === b.value)

source.value = {
  value: 42,
  extra: 1,
}

console.log(cached.value) // { value: 42, extra: 0 }

source.value = {
  value: 43,
  extra: 1,
}

console.log(cached.value) // { value: 43, extra: 1 }
js
import { useCached } from '@vueuse/core'
const source = ref({ value: 42, extra: 0 })
const cached = useCached(source, (a, b) => a.value === b.value)
source.value = {
  value: 42,
  extra: 1,
}
console.log(cached.value) // { value: 42, extra: 0 }
source.value = {
  value: 43,
  extra: 1,
}
console.log(cached.value) // { value: 43, extra: 1 }

类型声明

typescript
export declare function useCached<T>(
  refValue: Ref<T>,
  comparator?: (a: T, b: T) => boolean,
  watchOptions?: WatchOptions,
): Ref<T>

Source

SourceDemoDocs

贡献者

Anthony Fu
丶远方
sun0day
lvjiaxuan
Wenlu Wang

变更日志

No recent changes

Released under the MIT License.

Build faster with AI
New Masterclass to help you leverage AI in your Vue workflow.
Get Early Access