EffectScope Class — vue Architecture
Architecture documentation for the EffectScope class in effectScope.ts from the vue codebase.
Entity Profile
Dependency Diagram
graph TD 88c159e0_a17b_965d_b204_b7c3c59c6054["EffectScope"] 3c2912c4_0eac_a88d_e983_87f8f7c62fb5["effectScope.ts"] 88c159e0_a17b_965d_b204_b7c3c59c6054 -->|defined in| 3c2912c4_0eac_a88d_e983_87f8f7c62fb5 bfa57543_a939_87fb_c778_b44926b9d222["constructor()"] 88c159e0_a17b_965d_b204_b7c3c59c6054 -->|method| bfa57543_a939_87fb_c778_b44926b9d222 7cec0c78_2a54_8d22_ac5d_877616db37e6["run()"] 88c159e0_a17b_965d_b204_b7c3c59c6054 -->|method| 7cec0c78_2a54_8d22_ac5d_877616db37e6 771027bf_10da_a0fc_b40f_80f10443460b["on()"] 88c159e0_a17b_965d_b204_b7c3c59c6054 -->|method| 771027bf_10da_a0fc_b40f_80f10443460b 1f573862_09fc_2574_0dad_1051fc5c7f66["off()"] 88c159e0_a17b_965d_b204_b7c3c59c6054 -->|method| 1f573862_09fc_2574_0dad_1051fc5c7f66 712bda8a_c56d_9028_e161_65e495fb47d1["stop()"] 88c159e0_a17b_965d_b204_b7c3c59c6054 -->|method| 712bda8a_c56d_9028_e161_65e495fb47d1
Relationship Graph
Source Code
src/v3/reactivity/effectScope.ts lines 6–106
export class EffectScope {
/**
* @internal
*/
active = true
/**
* @internal
*/
effects: Watcher[] = []
/**
* @internal
*/
cleanups: (() => void)[] = []
/**
* @internal
*/
parent: EffectScope | undefined
/**
* record undetached scopes
* @internal
*/
scopes: EffectScope[] | undefined
/**
* indicates this being a component root scope
* @internal
*/
_vm?: boolean
/**
* track a child scope's index in its parent's scopes array for optimized
* removal
*/
private index: number | undefined
constructor(public detached = false) {
this.parent = activeEffectScope
if (!detached && activeEffectScope) {
this.index =
(activeEffectScope.scopes || (activeEffectScope.scopes = [])).push(
this
) - 1
}
}
run<T>(fn: () => T): T | undefined {
if (this.active) {
const currentEffectScope = activeEffectScope
try {
activeEffectScope = this
return fn()
} finally {
activeEffectScope = currentEffectScope
}
} else if (__DEV__) {
warn(`cannot run an inactive effect scope.`)
}
}
/**
* This should only be called on non-detached scopes
* @internal
*/
on() {
activeEffectScope = this
}
/**
* This should only be called on non-detached scopes
* @internal
*/
off() {
activeEffectScope = this.parent
}
stop(fromParent?: boolean) {
if (this.active) {
let i, l
for (i = 0, l = this.effects.length; i < l; i++) {
this.effects[i].teardown()
}
for (i = 0, l = this.cleanups.length; i < l; i++) {
this.cleanups[i]()
Defined In
Source
Frequently Asked Questions
What is the EffectScope class?
EffectScope is a class in the vue codebase, defined in src/v3/reactivity/effectScope.ts.
Where is EffectScope defined?
EffectScope is defined in src/v3/reactivity/effectScope.ts at line 6.
Analyze Your Own Codebase
Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.
Try Supermodel Free