zoukankan html css js c++ java

vue 节流

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <div id="app">
        
        <input type="text" @input="debounceInput($event)">
    </div>
    
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>



    <script type="text/javascript">
let timeout = null
function debounce(fn, wait) {
 if(timeout !== null) clearTimeout(timeout)
 timeout = setTimeout(fn, wait)
}
        new Vue({
            el:'#app',
             methods: {
              debounceInput(E){
               debounce(() => {
                console.log(E.target.value)
               }, 1000)
              }
             }
        })

    </script>
</body>
</html>

View Code

扩展：

更为常见用法：新建一个模块（定时器，状态值：点击立马执行 - 执行定时器 - 根据状态值判断是否执行传入函数）

浅谈VUE防抖与节流的最佳解决方案(函数式组件)

VUE+Element UI实现表格内直接编辑

查看全文

相关阅读:
Integer Inquiry
dfs求最短路径
 5.E
5.H
5.C
5.A
5.J
POJ
POJ
POJ

原文地址：https://www.cnblogs.com/justSmile2/p/11285935.html