인프런 커뮤니티 질문&답변
작성한 질문수
퀴즈 기본문제에서 props와 template의 값이 todo인 이유가 궁금합니다.
작성
·
175
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
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라고 해줘야 하는 것 같습니다.
자세한 설명은 캡틴판교님이 해주실 거라 믿습니다.