vue渲染函数render的问题

createElement(tagName,{数据对象},[子节点]);

    return createElement(
      'h' + this.level,
      [
        createElement('a', {
          attrs: {
            name: headingId,
            href: '#' + headingId
          }
        }, this.$slots.default)
      ]
    )

为什么可以直接越过数据对象,设置子节点,
虽然形参是可选的,但是作为第二个参数,不是作为数据对象传入了吗?
怎么能设置子节点呢?

第二个问题:数据对象内部的插槽没看懂,大佬解释下

  // 作用域插槽的格式为
  // { name: props => VNode | Array<VNode> }
  scopedSlots: {
    default: props => createElement('span', props.text)
  },
  // 如果组件是其它组件的子组件,需为插槽指定名称
  slot: 'name-of-slot',
  // 其它特殊顶层 properte

这两行要怎么看,有点疑惑,

阅读 3.4k
2 个回答
  1. createElement实现了函数的重载的,如果第二个参数是数组的话,会认为没有属性参数,直接认为是子节点
  2. scopedSlots是作用域插槽,也就是会给你传递参数,然后你根据参数决定渲染成什么样,所以才会需要你给他提供成一个函数;至于slot,是因为你现在这部分是父组件的一部分,你指定这个放在父组件的哪个插槽里面

第一个问题:
image.png
这是vue初始化render函数的代码,当我们手动调用render函数的时候,
会调用vm.$createElement函数。

image.png
这是createElement函数,在标红的地方写明了为什么第二个参数可以传递数组
scope 用法展示

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题