雖然vue推薦用template來創建你的html，但是在某些時候你也會用到render函數。
虛擬DOM
Vue 通過建立一個虛擬 DOM 對真實 DOM 發生的變化保持追蹤。請近距離看一下這行代碼：
return createElement('h1', this.blogTitle) |
createElement 到底會返回什么呢？其實不是一個實際的 DOM 元素。它更准確的名字可能是createNodeDescription，因為它所包含的信息會告訴 Vue 頁面上需要渲染什么樣的節點，及其子節點。我們把這樣的節點描述為“虛擬節點 (Virtual Node)”，也常簡寫它為“VNode”。“虛擬 DOM”是我們對由 Vue 組件樹建立起來的整個 VNode 樹的稱呼。
render方法會傳入一個createElement函數，它是一個用於創建DOM元素或者用於實例化其他組件的構造方法。render方法必須返回一個createElement函數的調用結果，也就是模版內的頂層元素（這個方法在vue2的習慣性使用中經常用h來命名）。
eg:
render示例：
export default {
render (createElement){
const menu_items = ["首頁","搜索","分類","系統"]
return createElement('ul',{
{
class:{'uk-nav':true}
},
menu_items.map(item=>createElement('li',item)))
}
}
}
上述render方法用template來寫的話如下:
<template>
<ul>
<li v-for="item in menu_items">
{{ item }}
</li>
</ul>
</template>
正是因為vue2中render只能返回一個createElement，所以vue2一定要有頂層元素。
render方法內不能再使用任何指令標記。其次，對組件或網頁元素之間的屬性賦值是通過createElement函數的第二個參數data進行的，domProps會向元素傳遞標准的DOM屬性，而propsDate則用於對其他的Vue組件的自定義屬性(props內的定義)進行賦值。
------------------------------------------------------------------------------------
createElement的定義
createElement(tag,data,children)
返回值vNode（虛擬節點）
參數說明:
tag 類型：String/Object/Function 說明：一個HTML標簽，組件類型,或一個函數
Data 類型：Object 說明：一個對應屬性的數據對象,用於向創建的節點對象設置屬性值
Children 類型：String/Array 說明：子節點
向構造的VNode對象設置文本時可以直接傳入字符串，例如：
createElement('div','這是行內文本')
輸出結果就是：
<div>這是行內文本</div>
data對象屬性表
{
// 和`v-bind:class`一樣的 API
'class': {
foo: true,
bar: false
},
// 和`v-bind:style`一樣的 API
style: {
color: 'red',
fontSize: '14px'
},
// 正常的 HTML 特性
attrs: {
id: 'foo'
},
// 組件 props
props: {
myProp: 'bar'
},
// DOM 屬性
domProps: {
innerHTML: 'baz'
},
// 事件監聽器基於 `on`
// 所以不再支持如 `v-on:keyup.enter` 修飾器
// 需要手動匹配 keyCode。
on: {
click: this.clickHandler
},
// 僅對於組件，用於監聽原生事件，而不是組件內部使用
// `vm.$emit` 觸發的事件。
nativeOn: {
click: this.nativeClickHandler
},
// 自定義指令。注意，你無法對 `binding` 中的 `oldValue`
// 賦值，因為 Vue 已經自動為你進行了同步。
directives: [
{
name: 'my-custom-directive',
value: '2',
expression: '1 + 1',
arg: 'foo',
modifiers: {
bar: true
}
}
],
// Scoped slots in the form of
// { name: props => VNode | Array<VNode> }
scopedSlots: {
default: props => createElement('span', props.text)
},
// 如果組件是其他組件的子組件，需為插槽指定名稱
slot: 'name-of-slot',
// 其他特殊頂層屬性
key: 'myKey',
ref: 'myRef'
}