title: Render children in vue.js Components
body: <p>How can I get the option into select in vue.js. React has something like <code>this.props.children</code>, which I used for such cases. How can I solve this in vue.js?</p>
  
  <p>I tried also to access the children with $children, but is was always an empty array.</p>
  
  <p>In this example, the selectbox hasn't the option's.
  Have added the example also on jsFiddle: <a href="https://jsfiddle.net/kt8urx7d/" rel="nofollow">https://jsfiddle.net/kt8urx7d/</a></p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var FormComp = Vue.extend({
      template: '#form-comp'
  });
  Vue.component('form-comp', FormComp);
  
  var SelectField = Vue.extend({
      template: '#select-field'
  });
  Vue.component('select-field', SelectField);
  
  var SelectFieldOption = Vue.extend({
      template: '#select-field-option'
  });
  Vue.component('select-field-option', SelectFieldOption);
  
  
  new Vue({
    el: '#container',
    template: '&lt;form-comp&gt;&lt;/form-comp&gt;'
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.26/vue.min.js"&gt;&lt;/script&gt;
  
  &lt;script type="x/template" id="form-comp"&gt;
   &lt;form&gt;
     &lt;h1&gt;This is my Form&lt;/h1&gt;
     &lt;select-field name="my-select-field"&gt;
       &lt;select-field-option value="my-value-1"&gt;My Text 1&lt;/select-field-option&gt;
        &lt;select-field-option value="my-value-2"&gt;My Text 2&lt;/select-field-option&gt;
      &lt;/select-field&gt;
    &lt;/form&gt;
  &lt;/script&gt;
  
  &lt;script type="x/template" id="select-field"&gt;
   &lt;select name="{{ name }}"&gt;
     &lt;!-- include children: select-field-option --&gt;
    &lt;/select&gt;
  &lt;/script&gt;
  
  &lt;script type="x/template" id="select-field-option"&gt;
   &lt;option value="{{ value }}"&gt;{{ content }}&lt;/option&gt;
  &lt;/script&gt;
  
  &lt;div id="container"&gt;&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>