vue slot have slot

1070106

by Syuan Shih

HTML

<div id="app">
    <child>HAVE SLOT: {{ msg }}</child>
    <p>{{ msg }}</p>
</div>

JavaScript

Vue.component('child', {
    template: '<div><slot></slot><p>{{ msg }}</p></div>',
    data: function() {
        return {
            msg: 'Component Message'
        }
    }
})

var vm = new Vue ({
    el: '#app',
    data: {
        msg: 'Vue instance Message'
    }
})