vue.js - `render` 函数没有替换插槽内容

Question

我使用的是vue 2.0。

我想生成这个模板:

<Poptip placement="right" width="400">
    <Button type="ghost">click 激活</Button>
    <div class="api" slot="content">my content</div>
</Poptip>

使用渲染函数:

render: (h, params) => {
  return h('Poptip', {
    props: {
      placement: 'right'
    }
  }, [
    h('Button', {
      props: {
        type: 'ghost'
      }
    }, 'Edit'),
    h('div', {
      props: {
        slot: 'content'
      }
    }, 'My content')
  ])
}

使用模板效果非常好。但是，当我使用 render 函数时，插槽的内容不会替换为我的内容。

Answer 1

您正在指定一个名为 slot 的 prop，其值为 content:

h('div', {
  props: {
    slot: 'content'
  }
}, 'My content')

要简单地指定一个名为content的slot:

h('div', {
  slot: 'content'
}, 'My content')

See the documentation.