zoukankan      html  css  js  c++  java
  • vue render {} 对象 说明文档

    Vue学习笔记进阶篇——Render函数

    http://www.mamicode.com/info-detail-1906336.html

    深入data object参数
    有一件事要注意:正如在模板语法中,v-bind:class和v-bind:style ,会被特别对待一样,在 VNode 数据对象中,下列属性名是级别最高的字段。该对象也允许你绑定普通的 HTML 特性,就像 DOM 属性一样,比如 innerHTML (这会取代 v-html指令)。
    
    {
      // 和`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
          }
        }
      ],
      // Scoped slots in the form of
      // { name: props => VNode | Array<VNode> }
      scopedSlots: {
        default: props => createElement(‘span‘, props.text)
      },
      // 如果组件是其他组件的子组件,需为 slot 指定名称
      slot: ‘name-of-slot‘,
      // 其他特殊顶层属性
      key: ‘myKey‘,
      ref: ‘myRef‘
    }

     

  • 相关阅读:
    3Sum Closest
    二叉树的下一个结点
    数组中重复的数字
    不用加减乘除做加法
    和为S的连续正数序列
    数组中只出现一次的数字
    求二叉树的是否为平衡二叉树
    由一道很简单的求两条链表的第一个公共节点的问题引发的思考
    第14章 网络编程
    第13章 文档与串行化
  • 原文地址:https://www.cnblogs.com/pengchenggang/p/10412297.html
Copyright © 2011-2022 走看看