vue项目优化之防抖案例分析

什么是防抖？

通俗理解，就是我们在点击请求或者点击加载等过程中，只需要点击一次，但由于请求慢，点击了好多次，导致多次请求，防抖就是在点击了好多次之后的最后一次才会请求。

案例分析：

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>vue项目优化之防抖案例分析</title>
<script src="/npm/vue@2/dist/vue.js"></script>
</head>
<body>
  <div id="app">
    输入内容：<input type="text"  @keyup="deb"/>
    <div> 输入次数：{{num}}</div>
  </div>
  <script>
      let time
      var app=new Vue({
          el:'#app',
          data:{
              num:0,
          },
          methods:{
              deb: function () {
  		let that = this
  		if (time) {
  		   clearTimeout(time)
  		}
  		time = setTimeout(function () {
  		   that.num++
  		   console.log('输入了'+that.num+'次')
  		   time = undefined;
  		}, 2000)
  	    }
          }
      })
  </script>
</body>
</html>

Vue结合MVVM模型的实现方法

利用vue实现一个图片水平瀑布流效果

运行vue函数提示将“vue”项识别为 cmdlet、函数、脚本文件或可运行程序的名称解决方法

vue-roter路由配置的3种模式介绍

vuejs前端文本对比不同痕迹

标签： vue, 防抖

上面是“vue项目优化之防抖案例分析”的全面内容，想了解更多关于 vuejs 内容，请继续关注web建站教程。

当前网址：https://ipkd.cn/webs_2212.html