todolist 컴포넌트 관련 질문입니다.

Question

<li v-for='(todoItem, index) in this.storedTodoItems' v-bind:key=    'todoItem.item' class='shadow'>   정말 부끄럽지만 너무 알고싶어서 질문 남깁니다. 배경지식이 없고 혼자 영어 해석하듯이 구문?을 해석하려니 너무 힘이드네요 ㅠㅠ 여기저기 물어보고 혼자 알아봤는데 잘 이해가 안가서요 storedTodoItems에 있는 객체를 todoitem에 넣어서 돌리고 key에 item값을 넣어주고 모든 li클래스에 shadow를 적용한다고 이해했는데 맞는건지 궁금하구요 todoItem 뒤에 index는 왜 입력해야하는지 궁금합니다. ㅜㅜ 절 버리지 말아주세요

Answer

안녕하세요 형욱님, 에고 코드 해석하시느라 많이 힘드셨겠네요..! 궁금해 하시는 부분이 아래 2가지인 것 같아요.

1. v-for 사용 방법 : v-for는 위와 같이 순회할 대상의 목록 데이터(보통 배열)을 in 뒤에 지정하고 각각의 데이터를 접근하여 목록을 표시합니다.

2. v-for의 index : v-for 디렉티브를 사용할 때 Vue.js 라이브러리 내부적으로 index 값을 제공해 줍니다. 더 자세한 내용은 아래 가이드 참고해 보세요 :)

https://vuejs.org/v2/api/#v-for

뷰린이탈출대작전

todolist 컴포넌트 관련 질문입니다.

이 글과 비슷한 Q&A

$router 를 이용한 메인 페이지로 이동

vuex 실행시 새로고침해야지만 리스트에 나타나는 현상

강의 자료 소스코드는 없나요?

export default 관련한 질문