对应文档节点: https://vuefe.cn/v2/guide/render-function.html#Slots
<body> <div id="app"> <div class="parent"> <anchored-heading> </anchored-heading> </div> </div> </body> <script> Vue.component(‘child‘, { render: function (createElement) { // <div><slot :text="msg"></slot></div> //debugger; return createElement(‘div‘, [ this.$scopedSlots.default({ text: this.msg }) ]) }, // template: ` // <div class="child"> // <slot :text="msg"></slot> // </div> // `, data: function () { return { msg: "Demo" } } }); Vue.component(‘anchored-heading‘, { render(createElement) { return createElement(‘div‘, [ createElement(‘child‘, { // pass scopedSlots in the data object // in the form of { name: props => VNode | Array<VNode> } scopedSlots: { default: function (props) { debugger; return createElement(‘span‘,‘hello-‘+ props.text) } } }) ]) }, // template: ` // <div class="parent"> // <child> // <template scope="props"> // <span>hello {{ props.text }}</span> // </template> // </child> // </div> // ` }) new Vue({ el: "#app" }); </script>
原文：http://www.cnblogs.com/wipphj/p/6703953.html