Anantha Padmanaban
Anantha Padmanaban

Reputation: 33

Which function is responsible for rendering the DOM in vue.js in its rendering engine?

Lets take vue 2.1.9.
link:https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.9/vue.js Do you guys know which function renders the DOM?

Upvotes: 0

Views: 152

Answers (1)

Sibeesh Venu
Sibeesh Venu

Reputation: 21749

You can always create a render function. Please see the below code.

Vue.component('anchored-heading', {
  render: function (createElement) {
    return createElement(
      'h' + this.level,   // tag name
      this.$slots.default // array of children
    )
  },
  props: {
    level: {
      type: Number,
      required: true
    }
  }
})

Here createElement is a function as follows.

// @returns {VNode}
createElement(
  // {String | Object | Function}
  // An HTML tag name, component options, or function
  // returning one of these. Required.
  'div',
  // {Object}
  // A data object corresponding to the attributes
  // you would use in a template. Optional.
  {
    // (see details in the next section below)
  },
  // {String | Array}
  // Children VNodes. Optional.
  [
    createElement('h1', 'hello world'),
    createElement(MyComponent, {
      props: {
        someProp: 'foo'
      }
    }),
    'bar'
  ]
)

Please see this post for more understanding.

Upvotes: 1

Related Questions