Vue official website tutorial, it is explained that the new attribute .passive will start the passive listener, that is, the default behavior will understand the trigger. My understanding is that I can write a loop event in the onSroll event, and then if the scrolling process is fast, it won"t be blocked by events in the onSroll.
<!-- () -->
<!-- `onScroll` -->
<!-- `event.preventDefault()` -->
<div v-on:scroll.passive="onScroll">...</div>
so I wrote this:
<div id="example-5" v-on:scroll.passive="onScroll" style="width: 300px;height: 300px;border: 4px solid red;overflow: scroll;">
sou la xi xi xi xi la xi la sou
sou la xi xi xi xi la xi la sou
sou la xi xi xi xi la xi la sou
sou la xi xi xi xi la xi la sou
</div>
<span id="demo">0</span>
var x = 0;
let example5 = new Vue({
el: "-sharpexample-5",
methods: {
onScroll: () => {
for (var i = 0; i < 10000; iPP) {
console.log(i);
}
document.getElementById("demo").innerHTML = x += 1;
}
}
})
but it feels like scrolling will not be blocked by the for loop, whether I set .passive , or .effecent or does not set . Is my understanding wrong?