/**
 * render: 渲染函數(shù)
 * 參數(shù): createElement
 * 參數(shù)類型: Function
 */
 render: function (createElement) {
  let _this = this['$options'].parent // 我這個(gè)是在 .vue 文件的 components 中寫的，這樣寫才能訪問this
  let _header = _this.$slots.header  // $slots: vue中所有分發(fā)插槽，不具名的都在default里
 
  /**
  * createElement 本身也是一個(gè)函數(shù)，它有三個(gè)參數(shù)
  * 返回值: VNode，即虛擬節(jié)點(diǎn)
  * 1. 一個(gè) HTML 標(biāo)簽字符串，組件選項(xiàng)對(duì)象，或者解析上述任何一種的一個(gè) async 異步函數(shù)。必需參數(shù)。{String | Object | Function} - 就是你要渲染的最外層標(biāo)簽
  * 2. 一個(gè)包含模板相關(guān)屬性的數(shù)據(jù)對(duì)象你可以在 template 中使用這些特性?？蛇x參數(shù)。{Object} - 1中的標(biāo)簽的屬性
  * 3. 子虛擬節(jié)點(diǎn) (VNodes)，由 `createElement()` 構(gòu)建而成，也可以使用字符串來生成“文本虛擬節(jié)點(diǎn)”?？蛇x參數(shù)。{String | Array} - 1的子節(jié)點(diǎn)，可以用 createElement() 創(chuàng)建，文本節(jié)點(diǎn)直接寫就可以
  */
  return createElement(    
   // 1. 要渲染的標(biāo)簽名稱：第一個(gè)參數(shù)【必需】   
   'div',  
   // 2. 1中渲染的標(biāo)簽的屬性，詳情查看文檔：第二個(gè)參數(shù)【可選】
   {
    style: {
     color: '#333',
     border: '1px solid #ccc'
    }
   },
   // 3. 1中渲染的標(biāo)簽的子元素?cái)?shù)組：第三個(gè)參數(shù)【可選】
   [
    'text',  // 文本節(jié)點(diǎn)直接寫就可以
    _this.$slots.default, // 所有不具名插槽，是個(gè)數(shù)組
    createElement('div', _header)  // createElement()創(chuàng)建的VNodes
   ]
  )
 }

    render:(h) => {
              return h('div',{
　　　　　　　　　　　　　　　　　　　//給div綁定value屬性
                props: {
                  value:''
                },
　　　　　　　　　　　　　　　　　　　//給div綁定樣式
　　　　　　　　　　　　　　　　　　　style:{
　　　　　　　　　　　　　　　　　　　　　　width:'30px'
　　　　　　　　　　　　　　　　　　　},　
　　　　　　　　　　　　　　　　　　　//給div綁定點(diǎn)擊事件　　
                on: {
                  click: () => {
                    console.log('點(diǎn)擊事件')
                  }
                },

              })
            }  

{
 // 和`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'
 },
 // 事件監(jiān)聽器基于 `on`
 // 所以不再支持如 `v-on:keyup.enter` 修飾器
 // 需要手動(dòng)匹配 keyCode。
 on: {
 click: this.clickHandler
 },
 // 僅對(duì)于組件，用于監(jiān)聽原生事件，而不是組件內(nèi)部使用
 // `vm.$emit` 觸發(fā)的事件。
 nativeOn: {
 click: this.nativeClickHandler
 },
 // 自定義指令。注意，你無法對(duì) `binding` 中的 `oldValue`
 // 賦值，因?yàn)?Vue 已經(jīng)自動(dòng)為你進(jìn)行了同步。
 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'
}