Skip to content

Commit

Permalink
feat: add debounce props
Browse files Browse the repository at this point in the history
  • Loading branch information
karl authored and karlito40 committed Jan 14, 2020
1 parent cec667b commit 68fddd1
Show file tree
Hide file tree
Showing 3 changed files with 30 additions and 13 deletions.
1 change: 1 addition & 0 deletions src/components/DynamicScroller.vue
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
:items="itemsWithSize"
:min-item-size="minItemSize"
:direction="direction"
:debounce="debounce"
key-field="id"
v-bind="$attrs"
@resize="onScrollerResize"
Expand Down
37 changes: 24 additions & 13 deletions src/components/RecycleScroller.vue
Original file line number Diff line number Diff line change
Expand Up @@ -191,6 +191,7 @@ export default {
beforeDestroy () {
this.removeListeners()
clearTimeout(this.scrollTimeout)
},
methods: {
Expand Down Expand Up @@ -236,19 +237,29 @@ export default {
},
handleScroll (event) {
if (!this.$_scrollDirty) {
this.$_scrollDirty = true
requestAnimationFrame(() => {
this.$_scrollDirty = false
const { continuous } = this.updateVisibleItems(false)
// It seems sometimes chrome doesn't fire scroll event :/
// When non continous scrolling is ending, we force a refresh
if (!continuous) {
clearTimeout(this.$_refreshTimout)
this.$_refreshTimout = setTimeout(this.handleScroll, 100)
}
})
const job = () => {
if (!this.$_scrollDirty) {
this.$_scrollDirty = true
requestAnimationFrame(() => {
this.$_scrollDirty = false
const { continuous } = this.updateVisibleItems(false)
// It seems sometimes chrome doesn't fire scroll event :/
// When non continous scrolling is ending, we force a refresh
if (!continuous) {
clearTimeout(this.$_refreshTimeout)
this.$_refreshTimeout = setTimeout(this.handleScroll, 100)
}
})
}
}
clearTimeout(this.scrollTimeout)
if (this.debounce) {
this.scrollTimeout = setTimeout(job, parseInt(this.debounce))
} else {
job()
}
},
Expand Down
5 changes: 5 additions & 0 deletions src/components/common.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,11 @@ export const props = {
default: 'vertical',
validator: (value) => ['vertical', 'horizontal'].includes(value),
},

debounce: {
type: [Number, String],
default: 0,
},
}

export function simpleArray () {
Expand Down

0 comments on commit 68fddd1

Please sign in to comment.