:key="todo.id" 에러 관련 질문 드립니다.

:key="todo.id" 를 추가할 경우 undefined 에러가 뜨는데 코드상에서 문제점을 알 수가 없어 질문 드립니다. 어느 부분에서 문제가 발생했을까요?? 코드는 다음과 같습니다.

-app.js

Vue.component('todo-item', {
  props: ['passedData'],
  template: '<p>{{ passedData.text }}</p>'
});
Vue.component('todo-list', {
  props: ['list'],
  template: '<p>{{list.text}}</p>'
});
var app = new Vue({
  el: '#app',
  data: {
    Todos: [
      { id: 0, text: 'Learn Vue.js' },
      { id: 1, text: 'Learn Components' },
      { id: 2, text: 'Learn Props' },
      { id: 3, text: 'Learn For Loop' }
    ],
    Languages: [
      { id: 0, text: 'python'},
      { id: 1, text: 'c++'},
      { id: 2, text: 'java'},
      { id: 3, text: 'objective-c'}
    ]
    // 할일 #1
    // 배열 안에 python, c++, java, objective-c 를 값으로 갖는
    // Languages 프로퍼티를 추가하여 위에 제작한 todo-list 컴포넌트에 전달하고,
    // 배열 값을 모두 for loop 로 출력하세요.
  }
});

-index.html의 내용

    <div id="app">
      <!-- Child Component -->
      <todo-item v-bind:todo="todo" v-for="todo in Todos" :key="todo.id"></todo-item>
      <todo-list v-bind:passed-data="language" v-for="language in Languages" :key="language.id"></todo-list>
      <!-- v-for에서 가져온 language를 다시 props인 passed-data로 전달해준다 -->
      <!-- 할일 #3 -->
      <!-- todo-list 컴포넌트 등록 -->
    </div>