강의 내용 중 vuex 에서 모든 사진에 좋아요 기능 적용

[이화정]

기존에 포스트에 적용하고 있던 postdata.js를 store.js에 적용을 시켜봤습니다.

store.js

포스트 목록 반복문에 아래처럼 데이터를 바인딩 해줬구요

Container.vue

 

Post.vue 파일에 사진을 클릭하면 좋아요 함수가 실행되게 $store.commit을 넣었습니다.

데이터 연동은 잘 되어서 post 반복문은 잘 돌아서 나오는데요...

사진을 클릭하고 console창을 확인해보니....

state.postdata.liked 나 state.postdata.likes 가 처음엔 undefined로 잡히네요....

이게 postdata.js의 몇번째 데이터인지를 몰라서 그러는 것 같아서 아래처럼 인덱스 번호 1을 넣어줘봤더니 1번째 포스트의 좋아요 기능이 잘 되는데요..... 저기에 i값이나 해당 post의 배열 인덱스값을 가져오려면 어떻게 해야할까요 ㅜㅜ

toggleLikes(state){
            console.log(state.postdata<strong>[1]</strong>.likes);
            state.postdata<strong>[1]</strong>.liked = !state.postdata<strong>[1]</strong>.liked;
            console.log(state.postdata<strong>[1]</strong>.likes);
            if (state.postdata<strong>[1]</strong>.liked == true){
                state.postdata<strong>[1]</strong>.likes++
            } else {
                state.postdata<strong>[1]</strong>.likes--
            }
        },

[codingapple]

<Post :i="i"> 이런 식으로 props로 보내면 Post.vue안에서 i 사용가능할듯요

그리고 store에 commit할 때 i같은 데이터를 함꼐 전송할 수 있습니다 

[이화정]

아 이런 빡대가리같으니 ㅠㅠ i도 데이터 연동을 해주면 되는거였는데.... 성공했습니다! 감사합니다.

[글쓴이]

글