跳到内容

useCounter

类别
导出大小
247 B
上次更改
5 天前

带有实用函数的基本计数器。

演示

计数: 0

基本用法

js
import { useCounter } from '@vueuse/core'

const { count, inc, dec, set, reset } = useCounter()

带选项的用法

js
import { useCounter } from '@vueuse/core'

const { count, inc, dec, set, reset } = useCounter(1, { min: 0, max: 16 })

类型声明

typescript
export interface UseCounterOptions {
  min?: number
  max?: number
}
/**
 * Basic counter with utility functions.
 *
 * @see https://vueuse.org.cn/useCounter
 * @param [initialValue]
 * @param options
 */
export declare function useCounter(
  initialValue?: MaybeRef<number>,
  options?: UseCounterOptions,
): {
  count:
    | Ref<number, number>
    | ShallowRef<number, number>
    | WritableComputedRef<number, number>
  inc: (delta?: number) => number
  dec: (delta?: number) => number
  get: () => number
  set: (val: number) => number
  reset: (val?: number) => number
}

源码

SourceDemoDocs

贡献者

Anthony Fu
IlyaL
Anthony Fu
Tycho
leewakin
Rock070
iChengbo
Damien Roche
Alex Kozack

更新日志

v12.8.0 于 2025/3/5
7432f - feat(types): 弃用 MaybeRefMaybeRefOrGetter,转而使用 Vue 的原生类型 (#4636)
v12.0.0-beta.1 于 2024/11/21
0a9ed - feat!: 移除 Vue 2 支持,优化 bundles 并清理代码 (#4349)
v10.8.0 于 2024/2/20
cf29c - fix: 允许 delta 为负数 (#3650)
v10.3.0 于 2023/7/30
6ae3a - feat: initialValue 支持 ref (#3266)

根据 MIT 许可证发布。