如何在调整大小时使用 Lodash Debounce

Question

我试图在调整窗口大小时触发一个事件，它似乎不起作用。

$(window).resize(function(){
   _.debounce(function(){
       console.log("hello");
   }, 100);
})

Answer 1

它实际上显示在他们的 lodash 文档中作为示例，lodash#debounce：

$(window).on('resize', _.debounce(function() {
  console.log('resized!');
}, 100));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.4/lodash.min.js"></script>

Answer 2

Vanilla JS 以防万一：

window.onresize = _.debounce(() => {
  console.log('resized!')
}, 100)

编辑：实际上可能更好地使用事件侦听器：

window.addEventListener('resize', _.debounce(() => {
  console.log('resized!')
}, 100)