console
Vue.component('child', {
render:function(createElement){
let node = createElement('h'+this.level, this.$slots.default)
console.log(node)
return node
},
props: {
level: {
type: Number,
required: true
}
}
})
new Vue({
el: "#div1",
data:{
level:4
}
})
<div id="div1">
<child :level="level">Hello world</child>
<input type="text" v-model="level" />
</div>
<!-- <script id="template" type="text/x-template">
<div>
<h1 v-if="level === 1">
<slot></slot>
</h1>
<h2 v-if="level === 2">
<slot></slot>
</h2>
<h3 v-if="level === 3">
<slot></slot>
</h3>
<h4 v-if="level === 4">
<slot></slot>
</h4>
<h5 v-if="level === 5">
<slot></slot>
</h5>
<h6 v-if="level === 6">
<slot></slot>
</h6>
</div>
</script> -->