fix: 无限滚动节流函数改成防抖
This commit is contained in:
parent
c12b5da9cd
commit
488c719a64
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -3,7 +3,7 @@
|
||||||
*/
|
*/
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import {throttle} from './util';
|
import {debounce} from './util';
|
||||||
import CONFIG from './config';
|
import CONFIG from './config';
|
||||||
|
|
||||||
export default class InfiniteScroll extends Component {
|
export default class InfiniteScroll extends Component {
|
||||||
|
@ -164,12 +164,12 @@ export default class InfiniteScroll extends Component {
|
||||||
|
|
||||||
scrollEl.addEventListener(
|
scrollEl.addEventListener(
|
||||||
'scroll',
|
'scroll',
|
||||||
throttle(this.scrollListener, 150),
|
debounce(this.scrollListener, 150),
|
||||||
this.options ? this.options : this.props.useCapture
|
this.options ? this.options : this.props.useCapture
|
||||||
);
|
);
|
||||||
scrollEl.addEventListener(
|
scrollEl.addEventListener(
|
||||||
'resize',
|
'resize',
|
||||||
throttle(this.scrollListener, 150),
|
debounce(this.scrollListener, 150),
|
||||||
this.options ? this.options : this.props.useCapture
|
this.options ? this.options : this.props.useCapture
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
18
src/util.js
18
src/util.js
|
@ -442,4 +442,22 @@ export function throttle(fn, wait){
|
||||||
last = now;
|
last = now;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 函数防抖
|
||||||
|
* @param {*} func 延时调用函数
|
||||||
|
* @param {*} wait 延迟多长时间
|
||||||
|
* @return Function 延迟执行的方法
|
||||||
|
*/
|
||||||
|
export function debounce(fn,delay) {
|
||||||
|
var timeout = null; // 创建一个标记用来存放定时器的返回值
|
||||||
|
return function (e) {
|
||||||
|
// 每当用户输入的时候把前一个 setTimeout clear 掉
|
||||||
|
clearTimeout(timeout);
|
||||||
|
// 然后又创建一个新的 setTimeout, 这样就能保证interval 间隔内如果时间持续触发,就不会执行 fn 函数
|
||||||
|
timeout = setTimeout(() => {
|
||||||
|
fn.apply(this, arguments);
|
||||||
|
}, delay);
|
||||||
|
}
|
||||||
}
|
}
|
Loading…
Reference in New Issue