title: Passing data into a Vue template
body: <p>I am fairly new to vue and can't figure out how to add data values within a template. I am trying to build a very basic form builder. If I click on a button it should add another array of data into a components variable. This is working. The I am doing a v-for to add input fields where some of the attributes are apart of the array for that component. I get it so it will add the input but no values are being passed into the input.</p>
  
  <p>I have created a jsfiddle with where I am stuck at. <a href="https://jsfiddle.net/a9koj9gv/2/" rel="noreferrer">https://jsfiddle.net/a9koj9gv/2/</a></p>
  
  <pre><code>&lt;div id="app"&gt;
      &lt;button @click="add_text_input"&gt;New Text Input Field&lt;/button&gt;
      &lt;my-component v-for="comp in components"&gt;&lt;/my-component&gt;
      &lt;pre&gt;{{ $data | json }}&lt;/pre&gt;
  &lt;/div&gt;
  
  new Vue({
      el: "#app",
  
      data: function() {
          return {
              components: [{
                      name: "first_name",
                      showname: "First Name",
                      type: "text",
                      required: "false",
                      fee: "0"
                    }]
              }
      },
  
      components: {
          'my-component': {
              template: '&lt;div&gt;{{ showname }}: &lt;input v-bind:name="name" v-bind:type="type"&gt;&lt;/div&gt;',
              props: ['showname', 'type', 'name']
          }
  
      },
  
      methods: {
          add_text_input: function() {
              var array = {
                      name: "last_name",
                      showname: "Last Name",
                      type: "text",
                      required: "false",
                      fee: "0"
                    };
              this.components.push(array);
          }
      }
  })
  </code></pre>
  
  <p>I appreciate any help as I know I am just missing something obvious.</p>
  
  <p>Thanks</p>