title: Vue.js v-for items won't render
body: <p>New to Vue js and I'm building my single page app here: <a href="http://jsfiddle.net/1s5jdc3b/25/" rel="nofollow noreferrer">fiddle</a>. I'm having trouble with my for loop (I believe). </p>
  
  <pre><code>const store = {
      items: [{
          todo: 'Clean Apartment.',
      },{
          todo: 'Mow the lawn!',
      },{
          todo: 'Pick up eggs, milk &amp; flour',
      }, {
          todo: 'Watch the big game',
      }],
  };
  
  const main = new Vue({
      el: '#vue-todos',
      components: {
          'add-todo': addTodo,
      },
      template: `
          &lt;add-todo&gt;&lt;/add-todo&gt;
          &lt;div&gt;
              &lt;ul&gt;
                  &lt;li v-for="item in items"&gt;
                      {{ item.todo }}
                  &lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      `,
      data: store,
  });
  </code></pre>
  
  <p>The form (<code>&lt;add-todo&gt;&lt;/add-todo&gt;</code>) renders fine. Why aren't the listed items rendering in the vue template?</p>