add basic handling for window resize
This commit is contained in:
parent
0779436714
commit
ef5b922e77
|
@ -25,6 +25,7 @@
|
||||||
<script>
|
<script>
|
||||||
import { virtualListStore } from './virtualListStore'
|
import { virtualListStore } from './virtualListStore'
|
||||||
import { AsyncLayout } from '../../_utils/AsyncLayout'
|
import { AsyncLayout } from '../../_utils/AsyncLayout'
|
||||||
|
import { registerResizeListener, unregisterResizeListener } from '../../_utils/resize'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
oncreate() {
|
oncreate() {
|
||||||
|
@ -35,6 +36,11 @@
|
||||||
// update all item heights in one batch for better perf
|
// update all item heights in one batch for better perf
|
||||||
this.store.batchUpdateForRealm('itemHeights', key, rect.height)
|
this.store.batchUpdateForRealm('itemHeights', key, rect.height)
|
||||||
})
|
})
|
||||||
|
this.doRecalculateHeight = this.doRecalculateHeight.bind(this)
|
||||||
|
registerResizeListener(this.doRecalculateHeight)
|
||||||
|
},
|
||||||
|
ondestroy() {
|
||||||
|
unregisterResizeListener(this.doRecalculateHeight)
|
||||||
},
|
},
|
||||||
store: () => virtualListStore,
|
store: () => virtualListStore,
|
||||||
computed: {
|
computed: {
|
||||||
|
|
24
routes/_utils/resize.js
Normal file
24
routes/_utils/resize.js
Normal file
|
@ -0,0 +1,24 @@
|
||||||
|
import debounce from 'lodash/debounce'
|
||||||
|
|
||||||
|
const DEBOUNCE_DELAY = 700
|
||||||
|
|
||||||
|
const listeners = new Set()
|
||||||
|
|
||||||
|
if (process.browser && process.env.NODE_ENV !== 'production') {
|
||||||
|
window.resizeListeners = listeners
|
||||||
|
}
|
||||||
|
|
||||||
|
if (process.browser) {
|
||||||
|
window.addEventListener('resize', debounce(() => {
|
||||||
|
console.log('resize')
|
||||||
|
listeners.forEach(listener => listener())
|
||||||
|
}, DEBOUNCE_DELAY))
|
||||||
|
}
|
||||||
|
|
||||||
|
export function registerResizeListener (listener) {
|
||||||
|
listeners.add(listener)
|
||||||
|
}
|
||||||
|
|
||||||
|
export function unregisterResizeListener (listener) {
|
||||||
|
listeners.delete(listener)
|
||||||
|
}
|
Loading…
Reference in a new issue