run() — vue Function Reference

Architecture documentation for the run() function in watcher.ts from the vue codebase.

Function typescript VueCore Observer calls 1 called by 4

Entity Profile

VueCore→ Observer→ run() — vue Function Reference

Dependency Diagram

graph TD
  71876f35_b702_de2d_a393_99f72b820099["run()"]
  6447431e_6924_8ca8_071d_44b55ba081b1["Watcher"]
  71876f35_b702_de2d_a393_99f72b820099 -->|defined in| 6447431e_6924_8ca8_071d_44b55ba081b1
  4608cf7a_77c1_65d7_34bb_dbc4ea050d61["mountComponent()"]
  4608cf7a_77c1_65d7_34bb_dbc4ea050d61 -->|calls| 71876f35_b702_de2d_a393_99f72b820099
  07ee0e45_f4fc_db24_4b7f_12ba4b3026a3["flushSchedulerQueue()"]
  07ee0e45_f4fc_db24_4b7f_12ba4b3026a3 -->|calls| 71876f35_b702_de2d_a393_99f72b820099
  82001dd5_db37_dcc4_2a46_4033717cc6a2["update()"]
  82001dd5_db37_dcc4_2a46_4033717cc6a2 -->|calls| 71876f35_b702_de2d_a393_99f72b820099
  bfa86000_56fb_9b0f_e681_81fbf55feaec["doWatch()"]
  bfa86000_56fb_9b0f_e681_81fbf55feaec -->|calls| 71876f35_b702_de2d_a393_99f72b820099
  9af667fb_20e8_0763_f10d_d63da0255ba8["get()"]
  71876f35_b702_de2d_a393_99f72b820099 -->|calls| 9af667fb_20e8_0763_f10d_d63da0255ba8
  style 71876f35_b702_de2d_a393_99f72b820099 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/core/observer/watcher.ts lines 211–239

  run() {
    if (this.active) {
      const value = this.get()
      if (
        value !== this.value ||
        // Deep watchers and watchers on Object/Arrays should fire even
        // when the value is the same, because the value may
        // have mutated.
        isObject(value) ||
        this.deep
      ) {
        // set new value
        const oldValue = this.value
        this.value = value
        if (this.user) {
          const info = `callback for watcher "${this.expression}"`
          invokeWithErrorHandling(
            this.cb,
            this.vm,
            [value, oldValue],
            this.vm,
            info
          )
        } else {
          this.cb.call(this.vm, value, oldValue)
        }
      }
    }
  }