跳到內容

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.dev.org.tw/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
}

原始碼

原始碼演示文檔

貢獻者

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 支援,優化 bundle 並清理 (#4349)
v10.8.0 於 2024/2/20
cf29c - fix: 允許 delta 為負數 (#3650)
v10.3.0 於 2023/7/30
6ae3a - feat: initialValue 支援 ref (#3266)

以 MIT 許可證發布。