// 마우스의 wheel 동작을 감지한다.
// 그런데 드래그를 할 때 마다 어떤 동작하게 시킨다면 상당한 부하가 걸리게 된다.
// 이를 컨트롤 하는게 wheel.passive 이다.
// 이벤트 처리와, 스크롤 동작을 독립시킨다.
// 일반적으로 5배 빨라진다고 한다.
<template>
  <div
    class="parent"
    @wheel.passive="handler">
    <div
      class="child">
    </div>
  </div>
</template>

<script>
export default {
  methods: {
    handler(e) {
      for(let i = 0; i < 10000; i++){
        console.log(e)
      }      
    },
  }
}
</script>

<style lang="scss" scoped>
  .parent {
    width: 200px;
    height: 100px;
    background-color: royalblue;
    margin: 10px;
    padding: 10px;
    overflow: auto;
    .child {
      width: 100px;
      height: 2000px;
      background-color: orange;
    }
  }
</style>