퀴즈 기본문제에서 props와 template의 값이 todo인 이유가 궁금합니다.

18.10.09 22:56 작성 조회수 111

0

이전에 props를 사용할때는

<child-component v-bind:passeddata="message"></child-component>

var app = new Vue({

el: '#app',

data: {

message: 'hello vue! passed form parent'

}

});

이런식으로 props의 값은 같았던 것 같은데 이번 퀴즈에서는

v-for에서 반복할 객체만 같은 이름으로 사용해야하는 이유가 무슨이유일까요?

답변 1

답변을 작성해보세요.

0

Daniel Ryu님의 프로필

Daniel Ryu

2019.01.17

Vue.component('todo-item', { props: ['my'], template: '<p>{{ my.text }}</p>' });
props와 template의 todo를 my로 바꾸었습니다. 이유는 없습니다. 제가 이렇게 부르고 싶기때문입니다.
하지만 이렇게 바꿔줬을 때는 index.html에서
<!-- Child Component --> <todo-item v-bind:my="todo" v-for="todo in Todos" key="todo.id"></todo-item>
v-bind: 바로 뒤의 todo를 my로 바꿔줘야합니다.
순서를 바꿔서 애매하긴 하지만 index.html을 먼저 작성했다고 생각해 본다면
index.html에서 v-bind:todo 라고 했기 때문에
app.js에서는 props와 template에 todo라고 해줘야 하는 것 같습니다.
자세한 설명은 캡틴판교님이 해주실 거라 믿습니다.