만들면서 학습하는 리액트(react):준비편 - 순수JS - 009
준비편 - 순수JS
[순수JS 1] 추천 검색어 2
요구사항
목록에서 검색어를 클릭하면 선택된 검색어의 검색 결과 화면으로 이동한다
구현
- KeywordListView.js 수정
...
export default class KeywordListView extends View {
constructor() {
...
this.template = new Template();
this.bindEvents();
}
...
bindEvents() {
delegate(this.element, "click", "li", event => this.handleClick(event));
}
handleClick(event) {
console.log(tag, "handleClick", event.target.dataset.keyword);
const value = event.target.dataset.keyword;
this.emit("@click", { value });
}
...
}
- Controller.js 수정
...
export default clas Controller {
...
subscribeViewEvents() {
...
this.tabView.on("@change", (event) => this.changeTab(event.detail.value));
this.keywordListView.on("@click", (event) => this.search(event.detail.value));
}
...
}