節(jié)流
方法一
import Throttle from 'lodash-decorators/throttle';export default class Search extends Component {constructor(props) {super(props)this.handleSearch = this.handleSearch.bind(this);}handleSubmit = (e) => {e.preventDefault();this.handleSearch();}@Throttle(300)handleSearch() {...}render() {return (<form onSubmit={this.handleSubmit}><form>)}}方法二
import throttle from 'lodash/throttle';export default class Search extends Component {constructor(props) {super(props)this.handleSearch = throttle(this.handleSearch, 1000);}handleSubmit = (e) => {e.preventDefault();this.handleSearch();}handleSearch = () => {...}render() {return (<form onSubmit={this.handleSubmit}><form>)}}防抖
寫法類似。。。
區(qū)別
debounce 和 throttle 各有特點,在不同的場景要根據(jù)需求合理的選擇。如果事件觸發(fā)是高頻但是有停頓時,可以選擇debounce;在事件連續(xù)不斷高頻觸發(fā)時,只能選擇 throttle ,因為 debounce 可能會導(dǎo)致一段時間內(nèi)動作只被執(zhí)行一次,界面出現(xiàn)閃爍。
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持武林網(wǎng)。
新聞熱點
疑難解答