EffectScope Class — vue Architecture
Architecture documentation for the EffectScope class in effectScope.ts from the vue codebase.
Entity Profile
Dependency Diagram
graph TD 15f3b57b_caa4_ff31_579b_0dcb115c7a9f["EffectScope"] 2201dcb0_bcf7_bce0_da13_64df866d683f["effectScope.ts"] 15f3b57b_caa4_ff31_579b_0dcb115c7a9f -->|defined in| 2201dcb0_bcf7_bce0_da13_64df866d683f 3c761336_d15a_6f6e_fbf8_3d523136ef4c["constructor()"] 15f3b57b_caa4_ff31_579b_0dcb115c7a9f -->|method| 3c761336_d15a_6f6e_fbf8_3d523136ef4c b30bbc11_9716_a61c_ae7f_4a3052b2a283["run()"] 15f3b57b_caa4_ff31_579b_0dcb115c7a9f -->|method| b30bbc11_9716_a61c_ae7f_4a3052b2a283 72b9b32d_1d0c_d7ed_1d79_0dbb66718b17["on()"] 15f3b57b_caa4_ff31_579b_0dcb115c7a9f -->|method| 72b9b32d_1d0c_d7ed_1d79_0dbb66718b17 ee998b84_db41_efcf_f5cd_2921e426161e["off()"] 15f3b57b_caa4_ff31_579b_0dcb115c7a9f -->|method| ee998b84_db41_efcf_f5cd_2921e426161e 83caa22f_a753_1666_0e0a_f4a733ccb55f["stop()"] 15f3b57b_caa4_ff31_579b_0dcb115c7a9f -->|method| 83caa22f_a753_1666_0e0a_f4a733ccb55f
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