Vuejs2.0学习之二（Render函数,createElement，vm.$slots，函数化组件，模板编译，JSX）

╰+哭是因爲堅強的太久メ 2022-04-15 04:41 243阅读 0赞

vue中的render函数，我在网上找了很多，下面这一篇文章最详细

[https://blog.csdn.net/kkae8643150/article/details/52910389/][https_blog.csdn.net_kkae8643150_article_details_52910389]

{
      // 和`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
      },
      // 自定义指令. 注意事项：不能对绑定的旧值设值
      // Vue 会为您持续追踨
      directives: [
        {
          name: 'my-custom-directive',
          value: '2'
          expression: '1 + 1',
          arg: 'foo',
          modifiers: {
            bar: true
          }
        }
      ],
      // 如果子组件有定义 slot 的名称
      slot: 'name-of-slot'
      // 其他特殊顶层属性
      key: 'myKey',
      ref: 'myRef'
    }

[https_blog.csdn.net_kkae8643150_article_details_52910389]: https://blog.csdn.net/kkae8643150/article/details/52910389/