Home / Function/ renderMixin() — vue Function Reference

renderMixin() — vue Function Reference

Architecture documentation for the renderMixin() function in render.ts from the vue codebase.

Entity Profile

Dependency Diagram

graph TD
  0c80f6b1_99f1_9c51_75ee_9bd37a1ef857["renderMixin()"]
  a1121c48_4b79_aab9_fb03_54bcfc49cd78["installRenderHelpers()"]
  0c80f6b1_99f1_9c51_75ee_9bd37a1ef857 -->|calls| a1121c48_4b79_aab9_fb03_54bcfc49cd78
  ad2344e6_3a5b_8f6e_1810_1802147c80c8["normalizeScopedSlots()"]
  0c80f6b1_99f1_9c51_75ee_9bd37a1ef857 -->|calls| ad2344e6_3a5b_8f6e_1810_1802147c80c8
  4f7e94d1_6f07_b9cc_f5ca_82c30acb57e4["syncSetupSlots()"]
  0c80f6b1_99f1_9c51_75ee_9bd37a1ef857 -->|calls| 4f7e94d1_6f07_b9cc_f5ca_82c30acb57e4
  387f4cc0_d1d8_687f_b954_207658b1a562["setCurrentInstance()"]
  0c80f6b1_99f1_9c51_75ee_9bd37a1ef857 -->|calls| 387f4cc0_d1d8_687f_b954_207658b1a562
  4bc7203c_0a34_d1e4_0d06_0db58ee2a28e["createEmptyVNode()"]
  0c80f6b1_99f1_9c51_75ee_9bd37a1ef857 -->|calls| 4bc7203c_0a34_d1e4_0d06_0db58ee2a28e
  style 0c80f6b1_99f1_9c51_75ee_9bd37a1ef857 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

src/core/instance/render.ts lines 95–172

export function renderMixin(Vue: typeof Component) {
  // install runtime convenience helpers
  installRenderHelpers(Vue.prototype)

  Vue.prototype.$nextTick = function (fn: (...args: any[]) => any) {
    return nextTick(fn, this)
  }

  Vue.prototype._render = function (): VNode {
    const vm: Component = this
    const { render, _parentVnode } = vm.$options

    if (_parentVnode && vm._isMounted) {
      vm.$scopedSlots = normalizeScopedSlots(
        vm.$parent!,
        _parentVnode.data!.scopedSlots,
        vm.$slots,
        vm.$scopedSlots
      )
      if (vm._slotsProxy) {
        syncSetupSlots(vm._slotsProxy, vm.$scopedSlots)
      }
    }

    // set parent vnode. this allows render functions to have access
    // to the data on the placeholder node.
    vm.$vnode = _parentVnode!
    // render self
    const prevInst = currentInstance
    const prevRenderInst = currentRenderingInstance
    let vnode
    try {
      setCurrentInstance(vm)
      currentRenderingInstance = vm
      vnode = render.call(vm._renderProxy, vm.$createElement)
    } catch (e: any) {
      handleError(e, vm, `render`)
      // return error render result,
      // or previous vnode to prevent render error causing blank component
      /* istanbul ignore else */
      if (__DEV__ && vm.$options.renderError) {
        try {
          vnode = vm.$options.renderError.call(
            vm._renderProxy,
            vm.$createElement,
            e
          )
        } catch (e: any) {
          handleError(e, vm, `renderError`)
          vnode = vm._vnode
        }
      } else {
        vnode = vm._vnode
      }
    } finally {
      currentRenderingInstance = prevRenderInst
      setCurrentInstance(prevInst)
    }
    // if the returned array contains only a single node, allow it
    if (isArray(vnode) && vnode.length === 1) {
      vnode = vnode[0]
    }
    // return empty vnode in case the render function errored out
    if (!(vnode instanceof VNode)) {
      if (__DEV__ && isArray(vnode)) {
        warn(
          'Multiple root nodes returned from render function. Render function ' +
            'should return a single root node.',
          vm
        )
      }
      vnode = createEmptyVNode()
    }
    // set parent
    vnode.parent = _parentVnode
    return vnode
  }
}

Domain

Subdomains

Frequently Asked Questions

What does renderMixin() do?
renderMixin() is a function in the vue codebase.
What does renderMixin() call?
renderMixin() calls 5 function(s): createEmptyVNode, installRenderHelpers, normalizeScopedSlots, setCurrentInstance, syncSetupSlots.

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free