render jsx

jsx 是一种看起来像html 但实际上是js 的语法扩展，它更接近dom的形式来描述一个组件的ui和状态信息。
Vue,js 提供了插件babel-plugin-transForm-vue-jsx 来支持JSX语法
使用creatElement 时，常用的配置如下。

 render (creatElement) {
    return creatElement('div', {
      props: { text: 'some text' },
      attrs: {
        id: 'myDiv'
      },
      domProps: {
        innerHTML: 'content'
      },
      on: {
        change: this.changeHander
      },
      nativeOn: {
        click: this.clickHander
      },
      class: {
        show: true,
        on: false
      },
      style: {
        color: '#fff',
        background: '#f50'
      },
      key: 'key',
      ref: 'element',
      refInfor: true,
      slot: 'slot'
    })
  },

上面的示例，使用jsx后 如下代码

 render (h) {
    return (
      <div
        id = 'myDiv'
        domPropsInnerHTML='content'
        onchange={this.changeHandler}
        nativeOnClick={this.clickHandler}
        class={{ show: true, on: false }}
        style={{ color: '#fff', background: '#f50' }}
        key='key'
        ref='element'
        refInFor
        slot='slot'
      ></div>
    )
  },