watchPausable

分类

侦听

导出大小

463 B

上次更改

上个月

别名

pausableWatch

可暂停的侦听器

信息

此函数将在未来版本中移除。

提示

可暂停的侦听器已添加到 Vue 3.5 中，请改用 const { stop, pause, resume } = watch(watchSource, callback)。

演示

源代码在线试玩 (beta)

在下面输入一些内容以触发侦听器

日志

用法

像使用正常的 watch 一样使用，但返回额外的 pause() 和 resume() 函数来控制。

import { watchPausable
 } from '@vueuse/core'
import { nextTick
, shallowRef
 } from 'vue'

const source
 = shallowRef
('foo')

const { stop
, pause
, resume
 } = watchPausable
(
  source
,
  v
 => console
.log
(`Changed to ${v
}!`),
)

source
.value
 = 'bar'
await nextTick
() // Changed to bar!

pause
()

source
.value
 = 'foobar'
await nextTick
() // (nothing happend)

resume
()

source
.value
 = 'hello'
await nextTick
() // Changed to hello!

类型声明

显示类型声明

export interface WatchPausableReturn extends Pausable {
  stop
: WatchStopHandle

}
export type WatchPausableOptions
<Immediate
> =
  WatchWithFilterOptions
<Immediate
> & PausableFilterOptions

/**
 * @deprecated This function will be removed in future version.
 */
export declare function watchPausable
<
  T
 extends Readonly
<WatchSource
<unknown>[]>,
  Immediate
 extends Readonly
<boolean> = false,
>(
  sources
: [...T
],
  cb
: WatchCallback
<MapSources
<T
>, MapOldSources
<T
, Immediate
>>,
  options
?: WatchPausableOptions
<Immediate
>,
): WatchPausableReturn
export declare function watchPausable
<
  T
,
  Immediate
 extends Readonly
<boolean> = false,
>(
  source
: WatchSource
<T
>,
  cb
: WatchCallback
<T
, Immediate
 extends true ? T
 | undefined : T
>,
  options
?: WatchPausableOptions
<Immediate
>,
): WatchPausableReturn
export declare function watchPausable
<
  T
 extends object,
  Immediate
 extends Readonly
<boolean> = false,
>(
  source
: T
,
  cb
: WatchCallback
<T
, Immediate
 extends true ? T
 | undefined : T
>,
  options
?: WatchPausableOptions
<Immediate
>,
): WatchPausableReturn
/** @deprecated use `watchPausable` instead */
export declare const pausableWatch
: typeof watchPausable