default.render() — vue Function Reference

Architecture documentation for the default.render() function in keep-alive.ts from the vue codebase.

Function typescript VueCore GlobalAPI calls 2

Entity Profile

VueCore→ GlobalAPI→ default.render() — vue Function Reference

Dependency Diagram

graph TD
  0f3602d7_5826_12c2_2045_c98c2b8840e4["default.render()"]
  302828a5_7155_979e_f7d9_5b26a70fd7d0["keep-alive.ts"]
  0f3602d7_5826_12c2_2045_c98c2b8840e4 -->|defined in| 302828a5_7155_979e_f7d9_5b26a70fd7d0
  682d1bec_9a22_eb6d_b27c_6e895e97e7db["_getComponentName()"]
  0f3602d7_5826_12c2_2045_c98c2b8840e4 -->|calls| 682d1bec_9a22_eb6d_b27c_6e895e97e7db
  7148fd83_ca43_5e18_2c2e_12a141f3eda2["matches()"]
  0f3602d7_5826_12c2_2045_c98c2b8840e4 -->|calls| 7148fd83_ca43_5e18_2c2e_12a141f3eda2
  style 0f3602d7_5826_12c2_2045_c98c2b8840e4 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/core/components/keep-alive.ts lines 130–170

  render() {
    const slot = this.$slots.default
    const vnode = getFirstComponentChild(slot)
    const componentOptions = vnode && vnode.componentOptions
    if (componentOptions) {
      // check pattern
      const name = _getComponentName(componentOptions)
      const { include, exclude } = this
      if (
        // not included
        (include && (!name || !matches(include, name))) ||
        // excluded
        (exclude && name && matches(exclude, name))
      ) {
        return vnode
      }

      const { cache, keys } = this
      const key =
        vnode.key == null
          ? // same constructor may get registered as different local components
            // so cid alone is not enough (#3269)
            componentOptions.Ctor.cid +
            (componentOptions.tag ? `::${componentOptions.tag}` : '')
          : vnode.key
      if (cache[key]) {
        vnode.componentInstance = cache[key].componentInstance
        // make current key freshest
        remove(keys, key)
        keys.push(key)
      } else {
        // delay setting the cache until update
        this.vnodeToCache = vnode
        this.keyToCache = key
      }

      // @ts-expect-error can vnode.data can be undefined
      vnode.data.keepAlive = true
    }
    return vnode || (slot && slot[0])
  }