강의

멘토링

커뮤니티

Inflearn コミュニティ Q&A

re1ee のプロフィール画像
re1ee

投稿した質問数

実習UI開発で学ぶ純粋なjavascriptとVueJS開発

最近の検索語 (実装)

질문이 있어요. stop

作成

·

231

1

<div v-if="history.length">

<ul class="list">

<li v-for="item in history" v-on:click="onClickKeyword(item.keyword)">

<span>{{item.keyword}}</span>

<span class="date">{{item.date}}</span>

<button class="btn-remove" v-on:click.stop="onClickRemoveHistory(item.keyword)"></button>

</li>

</ul>

</div>

    최근 검색어를 출력하는 부분인데요. click이벤트 stop을 왜 button에다 걸었는지 궁금하네요 위에 li 태그에 걸줄 알았는데, event bubbling을 li에서 멈춰줘야 하는거 아닌가 싶어서...propagation 동작을 제가 정확히 이해하지 못해서 그런거 같은데 자세한 설명 부탁드립니다!
vuejsjavascript

回答 1

0

event가 발생하는 타겟이 버튼이기 때문입니다.

버블링을 버튼에서 멈춰줘야 li에서의 이벤트가 일어나지 않으니까요.

 

이벤트 버블링에 대해서 구글 검색을 해보시면 그림과 함께 보다 보시면 이해가 되시리라 사려됩니다.

re1ee のプロフィール画像
re1ee

投稿した質問数

質問する