Vue.js v-itemはレンダリングされません

Question

Vue jsの新機能で、ここで私のシングルページアプリを構築しています：fiddle。私はforループに問題があります（私は信じています）。

const store = { 
    items: [{ 
     todo: 'Clean Apartment.', 
    },{ 
     todo: 'Mow the lawn!', 
    },{ 
     todo: 'Pick up eggs, milk & flour', 
    }, { 
     todo: 'Watch the big game', 
    }], 
}; 

const main = new Vue({ 
    el: '#vue-todos', 
    components: { 
     'add-todo': addTodo, 
    }, 
    template: ` 
     <add-todo></add-todo> 
     <div> 
      <ul> 
       <li v-for="item in items"> 
        {{ item.todo }} 
       </li> 
      </ul> 
     </div> 
    `, 
    data: store, 
}); 

フォーム（<add-todo></add-todo>）はうまく描画されます。表示されたアイテムがvueテンプレートに表示されないのはなぜですか？

Answer 1

のような以下、ルート要素にコンポーネントを置く：あなたは `items`を設定しなかった

template: ` 
     <div> 
      <add-todo></add-todo> 
      <ul> 
       <li v-for="todo in todos"> 
        {{ todo.todo }} 
       </li> 
      </ul> 
     </div> 
    `, 

http://jsfiddle.net/1s5jdc3b/27/