2021 01 30 토 TIL - 24
1483 단어 TILJavaScriptJavaScript
Today I Learned
- Javascript
🚩Where they are..
- in private gitHub
Today Review
- 초반에 아래 코드가 이해가 되지 않아 사용하지 않았고
TodoList.setState(nextState)
를 사용했다. 이렇게 사용한 후에야 아래 코드가 이해가 되어 다시 수정해두었다.
setState = (nextState) => {
this.state = nextState
setItem(TODOLIST_KEY, nextState)
this.components.forEach((component) => {
component.setState && component.setState(nextState)
})
}
TodoList.js
에서toggleTodoItem
과removeTodoItem
을 구현할때 클릭 아이템이 클릭의 개수에 따라 같은 오브젝트가 1개 -> 2개 -> 4개 -> 8개로 늘어나는 오류가 있었다. 알고보니setState()
안에setState()
를 사용하여 생겨난 결과였습니다. 수정후 정상작동했다.TodoInput.js
에서<input type='text' />
에 엔터키와 클릭 이벤트를 동시에 적용시키기위해<form></form>
태그를 생성하여addEventListener('submit', () => {})
을 사용했다. 이 과정에서 실수로remove all
버튼도form
태그 안으로 넣어버려 배열을 모두 지워도remove all
클릭시submit
이벤트가 동작하여 아래 코드가 동작되어 삭제버튼 하나가 보이게 되었다. 마크업 구조를 바로잡고 css로 스타일을 수정했다.
e.preventDefault()
let inputValue = this.$addItemInput.value
this.addTodoItem(inputValue)
this.$addItemInput.value = ''
Author And Source
이 문제에 관하여(2021 01 30 토 TIL - 24), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@gyeong-jin-kwak/2021-01-30-토-TIL-24저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)