背景：在項目開發(fā)過程中，使用CDN的方式來運用Vue媳板，列表頁面需要下拉分頁
思路：向 Window 對象添加事件
window.addEventListener("scroll", this.scrollBottom, true);
第一個參數(shù)是時間的類型（如：‘click’，‘mousedown’）
第二個參數(shù)是時間觸發(fā)后需要調(diào)用的函數(shù)
第三個參數(shù)是布爾值泽谨，用于描述事件是冒泡還是捕獲，該參數(shù)是可選的树灶。
new Vue({
el: '#app',
mounted: function () {
window.addEventListener("scroll", this.scrollBottom, true);
},
methods: {
scrollBottom: function(e) {
// 滾動到頁面底部時
const el = document.getElementById("app");
const windowHeight = window.screen.height;
const scrollTop =
document.documentElement.scrollTop || document.body.scrollTop;
const contentHeight = el.clientHeight;
const toBottom = contentHeight - windowHeight - scrollTop;
if (toBottom < 10 && !this.finished && !this.loading) {
this.loading = true;
// 請求的數(shù)據(jù)未加載完成時
this.getList();
}
},
}
})
事件傳遞有兩種方式：冒泡與捕獲。
事件傳遞定義了元素事件觸發(fā)的順序糯而。 如果你將 <p> 元素插入到 <div> 元素中天通，用戶點擊 <p> 元素, 哪個元素的 "click" 事件先被觸發(fā)呢？
在 冒泡 中熄驼，內(nèi)部元素的事件會先被觸發(fā)像寒，然后再觸發(fā)外部元素，即： <p> 元素的點擊事件先觸發(fā)瓜贾，然后會觸發(fā) <div> 元素的點擊事件诺祸。
在 捕獲 中，外部元素的事件會先被觸發(fā)祭芦，然后才會觸發(fā)內(nèi)部元素的事件筷笨，即： <div> 元素的點擊事件先觸發(fā) ，然后再觸發(fā) <p> 元素的點擊事件龟劲。
addEventListener() 方法可以指定 "useCapture" 參數(shù)來設(shè)置傳遞類型：
默認值為 false, 即冒泡傳遞胃夏，當值為 true 時, 事件使用捕獲傳遞。
document.getElementById("myDiv").addEventListener("click", myFunction, true);
