[10기 이연권] TodoList with CRUD #209
Open
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
dalcon10028
commented
Jul 26, 2021
|
|
||
| new TodoInput({ | ||
| $app, | ||
| addTodo: (inputValue) => { |
There was a problem hiding this comment.
state를 App.js에서 모두 관리하기 위한 과정에서 하위컴포넌트의 이벤트에 대한 함수가 길어지는 것 같습니다.
| @@ -0,0 +1,18 @@ | |||
| export default class TodoInput { | |||
| constructor({ $app, addTodo }) { | |||
There was a problem hiding this comment.
원하는 인자명을 정확하게 받기위해서 객체 형태로 작성했는데 다른 방식도 고려해보거나 다른 표기 방식을 고려해보는 것도 좋을 것 같습니다.
|
|
||
| this.$todolist.addEventListener('click', ({ target }) => { | ||
| if (target.className === 'toggle') { | ||
| toggleTodo(Number(target.closest('li').dataset.id)); |
There was a problem hiding this comment.
중복된 코드 Number(target.closest('li').dataset.id를 변수로 따로 빼서 줄이면 더 좋을 것 같습니다.
| import TodoList from './components/TodoList.js'; | ||
| import TodoCount from './components/TodoCount.js'; | ||
|
|
||
| import { ALL, ACTIVE, COMPLETED } from "./constants/todoState.js"; |
There was a problem hiding this comment.
코드 경로의 문자열이 컨벤션을 맞춰서 quotes로 작성해야될 것 같습니다.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
🚀 미션
🎯 요구사항
todo list에 todoItem을 키보드로 입력하여 추가하기
todo list의 체크박스를 클릭하여 complete 상태로 변경. (li tag 에 completed class 추가, input 태그에 checked 속성 추가)
todo list의 x버튼을 이용해서 해당 엘리먼트를 삭제
todo list를 더블클릭했을 때 input 모드로 변경. (li tag 에 editing class 추가) 단 이때 수정을 완료하지 않은 상태에서 esc키를 누르면 수정되지 않은 채로 다시 view 모드로 복귀
todo list의 item갯수를 count한 갯수를 리스트의 하단에 보여주기
todo list의 상태값을 확인하여, 해야할 일과, 완료한 일을 클릭하면 해당 상태의 아이템만 보여주기
🎯🎯 심화 요구사항
localStorage에 데이터를 저장하여, TodoItem의 CRUD를 반영하기. 따라서 새로고침하여도 저장된 데이터를 확인할 수 있어야 함