-
질문 & 답변
카테고리
-
세부 분야
프론트엔드
-
해결 여부
미해결
강의 내용을 따라 했는데도 안되는 문제
21.08.18 14:03 작성 조회수 129
0
예를 들어, 검색값을 입력하고 엔터를 누를 때 콘솔에 출력하는 것이나, x버튼을 누르거나 검색 결과를 완전히 지우고 난 뒤에 콘솔에 출력하는 기능을 만들 때, 분명히 강의에서 해주시는 내용대로 따라하면 콘솔에 출력되지 않는 문제가 발생하네요.
브랜치를 이동해가면서 비교해보아도 뭐를 빼먹은 것 같지는 않은데, 기능이 구현된 브랜치에서는 잘 되던 것이 기능 구현 전 브랜치에서 강의 내용을 따라 치면 안 되는 이유가 무엇인지 알 수 있을까요?
아래는 FormView3 브랜치에서 실습 내용을 따라 적은 코드 입니다.
FormView.js
import View from './View.js'
const tag = '[FormView]'
const FormView = Object.create(View)
FormView.setup = function (el) {
this.init(el)
this.inputEl = el.querySelector('[type=text]')
this.resetEl = el.querySelector('[type=reset')
this.showResetBtn(false)
this.bindEvents()
return this
}
FormView.showResetBtn = function (show = true) {
this.resetEl.style.display = show ? 'block' : 'none'
}
FormView.bindEvents = function () {
this.on('submit', e => e.preventDefault())
this.inputEl.addEventListener('keyup', e => this.onKeyup(e))
}
FormView.onKeyup = function (e) {
const enter = 13
this.showResetBtn(this.inputEl.value.length)
if (e.keyCode !== enter) return
this.emit('@submit', { input: this.inputEl.value })
}
export default FormView
MainControllers.js
import FormView from "../views/FormView.js";
const tag = "[MainController]";
export default {
init() {
FormView.setup(document.querySelector("form"))
.on('@submit', e => this.onSubmit(e.detail.input))
.on('@reset', e => this.onResetForm())
},
onSubmit(input) {
console.log(tag, 'onSubmit()', input)
},
onResetForm() {
console.log(tag, 'onResetForm()')
}
};
답변을 작성해보세요.
답변 2