Vue.js

# API области действия эффектов 3.2+

ИНФОРМАЦИЯ

Область действия эффектов — продвинутый API, предназначенный в первую очередь для авторов библиотек. Узнать подробнее о том, как использовать этот API, можно в соответствующем RFC (opens new window).

# effectScope

Создаёт объект области действия эффекта, который может захватывать другие реактивные эффекты (например, вычисляемые свойства и наблюдатели), созданные внутри него, чтобы иметь возможность уничтожить все эти эффекты вместе.

Типизация:

function effectScope(detached?: boolean): EffectScope

interface EffectScope {
  run<T>(fn: () => T): T | undefined // undefined если область действия неактивна
  stop(): void
}
1
2
3
4
5
6

Пример:

const scope = effectScope()

scope.run(() => {
  const doubled = computed(() => counter.value * 2)

  watch(doubled, () => console.log(doubled.value))

  watchEffect(() => console.log('Счётчик: ', doubled.value))
})

// для уничтожения всех эффектов в области действия
scope.stop()
1
2
3
4
5
6
7
8
9
10
11
12

# getCurrentScope

Возвращает текущую активную область действия эффекта, если таковая есть.

Типизация:

function getCurrentScope(): EffectScope | undefined
1

# onScopeDispose

Регистрация коллбэка для текущей активной области действия эффекта. Коллбэк будет вызван, когда связанная с ним область действия эффекта будет остановлена.

Этот метод можно использовать как не связанную с компонентами замену onUnmounted в переиспользуемых функциях композиций, поскольку функция setup() каждого компонента Vue также вызывается в области действия эффекта.

Типизация:

function onScopeDispose(fn: () => void): void
1

← Composition API →