<h3 dir="auto">What problem does this feature solve?</h3>
<p dir="auto">Provide slot for grandchildren</p>
<h3 dir="auto">What does the proposed API look like?</h3>
<p dir="auto">For example I have components Parent &gt; GroupedList &gt; SimpleList.<br>
I want to provide slot from Parent to SimpleList</p>
<p dir="auto">Currently I have to write in GroupedList like this:</p>
<div class="highlight highlight-text-html-vue notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;template slot=&quot;item&quot; slot-scope=&quot;{ itemData }&quot;&gt;
    &lt;slot name=&quot;item&quot; :itemData=&quot;itemData&quot;&gt;&lt;/slot&gt;
&lt;/template&gt;"><pre class="notranslate">&lt;<span class="pl-ent">template</span> <span class="pl-e">slot</span>=<span class="pl-s"><span class="pl-pds">"</span>item<span class="pl-pds">"</span></span> <span class="pl-e">slot-scope</span>=<span class="pl-s"><span class="pl-pds">"</span>{ itemData }<span class="pl-pds">"</span></span>&gt;
    &lt;<span class="pl-ent">slot</span> <span class="pl-e">name</span>=<span class="pl-s"><span class="pl-pds">"</span>item<span class="pl-pds">"</span></span> :<span class="pl-e">itemData</span>=<span class="pl-s1"><span class="pl-pds">"</span>itemData<span class="pl-pds">"</span></span>&gt;&lt;/<span class="pl-ent">slot</span>&gt;
&lt;/<span class="pl-ent">template</span>&gt;</pre></div>
<p dir="auto">Simple way(which doesn't work):</p>
<div class="highlight highlight-text-html-vue notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;slot name=&quot;item&quot; :itemData=&quot;itemData&quot;  slot=&quot;item&quot; slot-scope=&quot;{ itemData }&quot;&gt;&lt;/slot&gt;"><pre class="notranslate">&lt;<span class="pl-ent">slot</span> <span class="pl-e">name</span>=<span class="pl-s"><span class="pl-pds">"</span>item<span class="pl-pds">"</span></span> :<span class="pl-e">itemData</span>=<span class="pl-s1"><span class="pl-pds">"</span>itemData<span class="pl-pds">"</span></span>  <span class="pl-e">slot</span>=<span class="pl-s"><span class="pl-pds">"</span>item<span class="pl-pds">"</span></span> <span class="pl-e">slot-scope</span>=<span class="pl-s"><span class="pl-pds">"</span>{ itemData }<span class="pl-pds">"</span></span>&gt;&lt;/<span class="pl-ent">slot</span>&gt;</pre></div>
<p dir="auto">Or just like:</p>
<div class="highlight highlight-text-html-vue notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="&lt;slot name=&quot;item&quot; slot=&quot;item&quot;&gt;&lt;/slot&gt;"><pre class="notranslate">&lt;<span class="pl-ent">slot</span> <span class="pl-e">name</span>=<span class="pl-s"><span class="pl-pds">"</span>item<span class="pl-pds">"</span></span> <span class="pl-e">slot</span>=<span class="pl-s"><span class="pl-pds">"</span>item<span class="pl-pds">"</span></span>&gt;&lt;/<span class="pl-ent">slot</span>&gt;</pre></div>
<h3 dir="auto">What problem does this feature solve?</h3>
<p dir="auto">The related issue (<a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="213072676" data-permission-text="Title is private" data-url="https://github.com/vuejs/vue/issues/5151" data-hovercard-type="issue" data-hovercard-url="/vuejs/vue/issues/5151/hovercard" href="https://github.com/vuejs/vue/issues/5151">#5151</a>) is closed, so I need to clarify my point.</p>
<p dir="auto">It should exist convenient way to define template for items of hierarchical component (for example, tree or list with sections).<br>
I know, it can be solved with render functions, but it is not so "native" way of building components in vue as in react. I mean, writing / reading render functions is more uncomfortable for average vue user, because they are used only occasionally. It's even worse, if user need to setup webpack / babel / jsx. So I think, render functions should be avoided for not-so-advanced cases.</p>
<p dir="auto">Slots can be "passed" to children using templates, like this:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;child&gt;
    &lt;template slot-scope=&quot;props&quot;&gt;
        &lt;slot v-bind=&quot;props&quot;&gt;&lt;/slot&gt;
    &lt;/template&gt;
&lt;/child&gt;"><pre class="notranslate"><code class="notranslate">&lt;child&gt;
    &lt;template slot-scope="props"&gt;
        &lt;slot v-bind="props"&gt;&lt;/slot&gt;
    &lt;/template&gt;
&lt;/child&gt;
</code></pre></div>
<p dir="auto">But there are some drawbacks:</p>
<ol dir="auto">
<li>This creates wrapper function on each level. First, we have wrapper. Then wrapper of wrapper, and so on.</li>
<li>This breaks fallback content (default template) feature.</li>
</ol>
<h3 dir="auto">What does the proposed API look like?</h3>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;child&gt;
    &lt;slot slot-scope&gt;&lt;/slot&gt;
&lt;/child&gt;"><pre class="notranslate"><code class="notranslate">&lt;child&gt;
    &lt;slot slot-scope&gt;&lt;/slot&gt;
&lt;/child&gt;
</code></pre></div>
<h3 dir="auto">Remark</h3>
<p dir="auto">I propose syntax, which is boiled down version of first markup, and can be supported by compiler. Here is my test implementation (it seems quite easy): <a class="commit-link" data-hovercard-type="commit" data-hovercard-url="https://github.com/shameleo/vue-slot-pass-demo/commit/bdb6cbbf3ab7574d4b2d350f7d866e2bc609a043/hovercard" href="https://github.com/shameleo/vue-slot-pass-demo/commit/bdb6cbbf3ab7574d4b2d350f7d866e2bc609a043">shameleo/vue-slot-pass-demo@<tt>bdb6cbb</tt></a><br>
If you give me green light, I'll try to prepare PR. If something is missed in implementation, let me know, please.</p>