Vue的render无法渲染children节点

Question

使用Vue的渲染函数渲染html元素，父节点可以渲染出来，子节点却渲染不出来。

组件内：
    <script>
    export default {
      props: {
        renderConfig: {
          type: Object,
          required: true
        }
      },
      data() {
        return {}
      },
      render(h) {
        let ele = this.renderElements(h, this.renderConfig)
        console.log(ele)
        return ele
      },
      methods: {
        renderElements(h, renderConfig) {
          if (!h || !renderConfig) {
            return
          }
    
          if (renderConfig.children && renderConfig.children.length) {
            let children = []
    
            for (let element of renderConfig.children) {
              // 递归查找有子元素的配置并render出vnode
              children.push(this.renderElements(h, element))
            }
            console.log(children)
            return h(
              renderConfig.tag,
              { ...Object.assign(renderConfig.properties) },
              children
            )
          }
    
          return h(renderConfig.tag, { ...Object.assign(renderConfig.properties) })
        }
      }
    }
    </script>

    传给组件的props：
    {
            tag: 'div',
            properties: {
              attrs: { id: 'myDiv', 'data-url': 'www.abc123.com' },
              domProps: { innerHTML: 'Hello, myDiv' },
              on: {
                click: this.handleClick
              }
            },
            children: [
              {
                tag: 'label',
                properties: {
                  attrs: { id: 'myLabel' },
                  domProps: { innerHTML: '输入框： ' }
                }
              },
              {
                tag: 'input',
                properties: {
                  attrs: { id: 'myInput', value: 'hello~~' }
                },
                on: { change: this.handleChange }
              }
            ]
          }

ele的log结果：

两个子vnode的log结果：


DOM的结果：

可以看见在renderElements()里子元素（vnode）是有值的，而到了render(h)之后就消失了，请问是哪里出了错？
鄙人已经看了好久了，实在是看不出来。。。。

Answer 1

改下这里domProps: { innerHTML: 'Hello, myDiv' }试试，可能是因为innerHTML把子组件覆盖了

Answer 2

你好，请问这个子节点的渲染是出于什么原因考虑自己写了递归？我刚才实验了一下，render 的 createElement的第三个参数可以接受子节点信息。
比如我有一个数据结构` let test_div =

{
  'tag': 'div',
  'data': {
    'attrs': {'id': 'div-1'}
  }
  , 'children': [
  {
    'tag': 'div',
    'data': {
      'attrs': {'id': 'div-2'}
    }
    , 'children': [
    {
      'tag': 'div',
      'data': {
        'attrs': {'id': 'div-3'}
      }
      , 'children': []
    }
  ]
  },{
    'tag': 'div',
    'data': {
      'attrs': {'id': 'div-4'}
    }
    , 'children': [
      {
        'tag': 'div',
        'data': {
          'attrs': {'id': 'div-5'}
        }
        , 'children': []
      }
    ]
  }
]
}`
我渲染的时候就直接

<script>
  export default {
    name: "DomCreate",
    render(createElement){
      return createElement(this.list.tag,{...Object.assign(this.list.data)},this.list.children)
    },
    props:{
      list:Object
    }
  }
</script>

这样就可以直接把这个结构渲染出来。
所以你自己写这个递归是出于什么特殊的考虑么？