title: Nested components in Vue.js
body: <p>I struggle in creating nested components where each layer includes templates:</p>
  
  <pre><code>&lt;wizard&gt;
      &lt;step name="first"&gt;Do this step first!&lt;/step&gt;
      &lt;step name="second"&gt;This should follow&lt;/step&gt;
  &lt;/wizard&gt;
  </code></pre>
  
  <p>(full example: <a href="http://jsfiddle.net/maxhq/9o4qxd7t/" rel="nofollow">http://jsfiddle.net/maxhq/9o4qxd7t/</a>)</p>
  
  <p>I only get templates to work <em>either</em> for parent <em>or</em> for child components, never for both.</p>
  
  <ul>
  <li>if parent has no template and is used with <code>&lt;... inline-template&gt;</code>, child components (and their templates) are evaluated (like in <a href="http://jsfiddle.net/hajkrupo/3/" rel="nofollow">http://jsfiddle.net/hajkrupo/3/</a>)</li>
  <li>if parent includes a template (even with special tag <code>&lt;content&gt;</code>), then the child components do not get inserted/evaluated</li>
  </ul>
  
  <p>Can this be solved in vue.js?</p>