JSFiddle - React, Tailwind, and code Playground

by leopoldthecuber

HTML

<script src="//unpkg.com/vue/dist/vue.js"></script>
<div id="app"></div>

JavaScript

Vue.component('my-component', {
  mounted() {
    console.log(this.$slots.footer)
  },
  template: `
    <div>
      <slot name="footer">
        <span>defult footer</span>
      </slot>
    </div>
  `
});

var App = Vue.extend();

new App({
  el: '#app',
  data() {
    return {
      visible: false
    }
  },
  template: `
    <div>
      <my-component>
        <div>
          <p slot="footer">my footer</p>
        </div>
      </my-component>   
    </div>
  `
})