![]() |
"각 todo 상태의 isDone 속성을 변경하여 todo의 완료 유무 처리하기" 완료된 todo에서는 취소선 스타일 적용하기 todos 목록에서 특정 todo의 isDone 속성을 변경하는 updateTodo 액션 정의 |
![]() |
todo 내용을 클릭하면 선택된 todo의 id를 인자로 전달해 updateTodo 메서드를 호출 |
![]() |
전달받은 todo의 id 값을 활용해 선택된 todo와 동일 todo를 목록에서 검색 일치하는 todo 데이터의 isDone 속성 값을 반대로 재할당 후 새로운 todo 목록 반환 |
![]() |
todo 객체의 isDone 속성 값에 따라 스타일 바인딩 적용하기 |
![]() |
결과 확인 |
'WEB > Vue.js' 카테고리의 다른 글
[Vue.js][State Management] 11. Local Storage, pinia-plugin-persistedstate (0) | 2024.05.05 |
---|---|
[Vue.js][State Management] 10. Counting Todo (0) | 2024.05.05 |
[Vue.js][State Management] 8. Delete Todo (0) | 2024.05.05 |
[Vue.js][State Management] 7. Create Todo (0) | 2024.05.05 |
[Vue.js][State Management] 6. Read Todo (0) | 2024.05.05 |