vuejs2 - 如何在 vue2 渲染函数中将一些值绑定到 this.$slots.default？

Question

众所周知，我们可以使用 this.$slots.default 创建一个 slot。

如果我们使用 template ，我们可以像这样向 slot 发送一个值：

<slot name="xiaoming" value="gugugu"></slot> 

但是如何在 vue2 的渲染函数中向 this.$slots.default 发送一个值？

标签： vuejs2slot

Answer 1

如果只是想将一个值传递给渲染组件中的插槽，您可以这样做：

Vue.component('wrapper', {
  render(h) {
    return h('div', [ 
        this.$scopedSlots.default({
        test: 'works!'
        })
    ])
  }
})
new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!'
  }
})

就在外面用

<div id="app">
  <p>{{ message }}</p>
  <wrapper>
    <template v-slot="props">
      <p>{{props.test}}</p>
    </template>
  </wrapper>
</div>

继续...