title: VueJs - pass slot from child component to parent
body: <p>I am having difficulty to make use of named slot from children in parent component.
  So I am making tabs component with main Tabs and child Tab components.
  My Tabs:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;template&gt;
      &lt;div class=&quot;tabsMainContainer&quot;&gt;
          &lt;div class=&quot;tabsContainer&quot;&gt;
              &lt;ul class=&quot;tabsHeader&quot;&gt;
                  &lt;li
                      v-for=&quot;(tab, index) in tabs&quot;
                      :key=&quot;tab.title&quot;
                      :class=&quot;{tabActive: (index == selectedIndex)}&quot;
                      @click=&quot;selectTab(index)&quot;
                  &gt;
                  &lt;slot name=&quot;icon&quot;/&gt;
                      {{ tab.title }}
                  &lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
          &lt;div class=&quot;tabsContent&quot;&gt;&lt;slot/&gt;&lt;/div&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  <p>I get tabs object with <code>this.$children</code></p>
  <p>and then my Tab component:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;template&gt;
    &lt;div v-show=&quot;isActive&quot; class=&quot;tab&quot;&gt;
        &lt;slot name=&quot;icon&quot;/&gt;
      &lt;slot/&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  </code></pre>
  <p>And use of that:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;Tabs class=&quot;tabsComponent&quot;&gt;
          &lt;Tab title=&quot;first&quot;&gt;
              &lt;template v-slot:icon&gt;Icon&lt;/template&gt;
              Content
          &lt;/Tab&gt;
          &lt;Tab title=&quot;second&quot;&gt;Content second&lt;/Tab&gt;
  &lt;/Tabs &gt;
  </code></pre>
  <p>while Content as such works fine, it appears in default slot, the icon slot also appears in default slot in main Tab component. How can I get icon slot from children, and display it in icon slot of main Tab component?</p>