directives.ts — vue Source File

Architecture documentation for directives.ts, a typescript file in the vue codebase. 5 imports, 1 dependents.

File typescript CoreRuntime Observer 5 imports 1 dependents 6 functions

Entity Profile

CoreRuntime→ Observer→ directives.ts — vue Source File

Dependency Diagram

graph LR
  8dce6c3f_4a73_cd05_13cf_97c1f249a21d["directives.ts"]
  a4f22c0d_db48_725a_0132_272983c09232["patch"]
  8dce6c3f_4a73_cd05_13cf_97c1f249a21d --> a4f22c0d_db48_725a_0132_272983c09232
  02e43f4a_da65_7acd_5a98_0f017554a159["index"]
  8dce6c3f_4a73_cd05_13cf_97c1f249a21d --> 02e43f4a_da65_7acd_5a98_0f017554a159
  c078cebd_36ee_e879_0a89_19cf4b3ed9a7["index"]
  8dce6c3f_4a73_cd05_13cf_97c1f249a21d --> c078cebd_36ee_e879_0a89_19cf4b3ed9a7
  81ed4f13_7d68_6e21_7425_cf978f68576f["vnode"]
  8dce6c3f_4a73_cd05_13cf_97c1f249a21d --> 81ed4f13_7d68_6e21_7425_cf978f68576f
  907f4994_ea28_43b1_7976_0db9f0e97637["component"]
  8dce6c3f_4a73_cd05_13cf_97c1f249a21d --> 907f4994_ea28_43b1_7976_0db9f0e97637
  0387bca1_38ba_3c61_9c03_1478ecbafd5f["index.ts"]
  0387bca1_38ba_3c61_9c03_1478ecbafd5f --> 8dce6c3f_4a73_cd05_13cf_97c1f249a21d
  style 8dce6c3f_4a73_cd05_13cf_97c1f249a21d fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { emptyNode } from 'core/vdom/patch'
import { resolveAsset, handleError } from 'core/util/index'
import { mergeVNodeHook } from 'core/vdom/helpers/index'
import type { VNodeDirective, VNodeWithData } from 'types/vnode'
import type { Component } from 'types/component'

export default {
  create: updateDirectives,
  update: updateDirectives,
  destroy: function unbindDirectives(vnode: VNodeWithData) {
    // @ts-expect-error emptyNode is not VNodeWithData
    updateDirectives(vnode, emptyNode)
  }
}

function updateDirectives(oldVnode: VNodeWithData, vnode: VNodeWithData) {
  if (oldVnode.data.directives || vnode.data.directives) {
    _update(oldVnode, vnode)
  }
}

function _update(oldVnode, vnode) {
  const isCreate = oldVnode === emptyNode
  const isDestroy = vnode === emptyNode
  const oldDirs = normalizeDirectives(
    oldVnode.data.directives,
    oldVnode.context
  )
  const newDirs = normalizeDirectives(vnode.data.directives, vnode.context)

  const dirsWithInsert: any[] = []
  const dirsWithPostpatch: any[] = []

  let key, oldDir, dir
  for (key in newDirs) {
    oldDir = oldDirs[key]
    dir = newDirs[key]
    if (!oldDir) {
      // new directive, bind
      callHook(dir, 'bind', vnode, oldVnode)
      if (dir.def && dir.def.inserted) {
        dirsWithInsert.push(dir)
      }
    } else {
      // existing directive, update
      dir.oldValue = oldDir.value
      dir.oldArg = oldDir.arg
      callHook(dir, 'update', vnode, oldVnode)
      if (dir.def && dir.def.componentUpdated) {
        dirsWithPostpatch.push(dir)
      }
    }
  }

  if (dirsWithInsert.length) {
    const callInsert = () => {
      for (let i = 0; i < dirsWithInsert.length; i++) {
        callHook(dirsWithInsert[i], 'inserted', vnode, oldVnode)
      }
    }
// ... (78 more lines)