vue之debounce属性被移除及处理详解


Posted in Javascript onNovember 13, 2019

vue 2.0 debounce已经被移除

参考文档:

https://cn.vuejs.org/v2/guide/migration.html#替换-debounce-过滤器

https://vuejs.org/v2/guide/migration.html#debounce-Param-Attribute-for-v-model-removed

完整代码:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>vue-循环重复</title>
  <script src="https://unpkg.com/vue@2.5.9/dist/vue.js"></script>
  <script src="https://unpkg.com/lodash@4.13.1/lodash.min.js"></script>
</head>
<body>
<div id="box">
  <input type="button" @click="add" value="添加">
  <ul>
    <li v-for="val in arr">
      [[val]]
    </li>
  </ul>
</div>
<script>
  var vm = new Vue({
    delimiters: ['[[', ']]'],
    el: '#box',
    data: {
      arr: ['apple', 'pear', 'grape']
    },
    methods: {
      add: _.debounce(function () {
        this.arr.push('tomato')
      }, 1000)
    }

  })
</script>
</body>
</html>

在使用官方的'_.debounce()时要导入:

<script src="https://unpkg.com/lodash@4.13.1/lodash.min.js"></script>

以上这篇vue之debounce属性被移除及处理详解就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js 发个判断字符串是否为符合标准的函数
Apr 27 Javascript
js将long日期格式转换为标准日期格式实现思路
Apr 07 Javascript
jQuery获取选中内容及设置元素属性的方法
Jul 09 Javascript
BootStrap日期控件在模态框中选择时间下拉菜单无效的原因及解决办法(火狐下不能点击)
Aug 18 Javascript
前端面试题及答案整理(二)
Aug 26 Javascript
学习vue.js条件渲染
Dec 03 Javascript
Bootstrap Table 删除和批量删除
Sep 22 Javascript
在vue项目中使用md5加密的方法
Sep 14 Javascript
详解js删除数组中的指定元素
Oct 31 Javascript
vue表单验证你真的会了吗?vue表单验证(form)validate
Apr 07 Javascript
Vue3.0 响应式系统源码逐行分析讲解
Oct 14 Javascript
vue实现评价星星功能
Jun 30 Javascript
Vue的click事件防抖和节流处理详解
Nov 13 #Javascript
vue表单数据交互提交演示教程
Nov 13 #Javascript
解决vuex数据异步造成初始化的时候没值报错问题
Nov 13 #Javascript
前端vue-cli项目中使用img图片和background背景图的几种方法
Nov 13 #Javascript
基于vue-cli3和element实现登陆页面
Nov 13 #Javascript
vue data引入本地图片的两种方式小结
Nov 13 #Javascript
vue中的 $slot 获取插槽的节点实例
Nov 12 #Javascript
You might like
php数字转汉字代码(算法)
2011/10/08 PHP
PHP图片处理类 phpThumb参数用法介绍
2012/03/11 PHP
高质量PHP代码的50个实用技巧必备(下)
2016/01/22 PHP
php+Ajax无刷新验证用户名操作实例详解
2019/03/04 PHP
jQuery Jcrop插件实现图片选取功能
2011/11/23 Javascript
分享XmlHttpRequest调用Webservice的一点心得
2012/07/20 Javascript
JavaScript中valueOf函数与toString方法深入理解
2012/12/02 Javascript
用js+iframe形成页面的一种遮罩效果的具体实现
2013/12/31 Javascript
js中文逗号转英文实现
2014/02/11 Javascript
javascript将DOM节点添加到文档的方法实例分析
2015/08/04 Javascript
jQuery实现遍历复选框的方法示例
2017/03/06 Javascript
JS验证input输入框(字母,数字,符号,中文)
2017/03/23 Javascript
angularjs实现搜索的关键字在正文中高亮出来
2017/06/13 Javascript
深入理解基于vue-cli的vuex配置
2017/07/24 Javascript
基于nodejs res.end和res.send的区别
2018/05/14 NodeJs
详解基于Vue,Nginx的前后端不分离部署教程
2018/12/04 Javascript
Nodejs libuv运行原理详解
2019/08/21 NodeJs
jquery轮播图插件使用方法详解
2020/07/31 jQuery
swiper4实现移动端导航栏tab滑动切换
2020/10/16 Javascript
vue的$http的get请求要加上params操作
2020/11/12 Javascript
WebStorm无法正确识别Vue3组合式API的解决方案
2021/02/18 Vue.js
Python元组操作实例分析【创建、赋值、更新、删除等】
2017/07/24 Python
Python实现两款计算器功能示例
2017/12/19 Python
Python装饰器模式定义与用法分析
2018/08/06 Python
详解Python中的各种转义符\n\r\t
2019/07/10 Python
Django操作session 的方法
2020/03/09 Python
python实现人机五子棋
2020/03/25 Python
一款利用css3的鼠标经过动画显示详情特效的实例教程
2014/12/29 HTML / CSS
巴西婴儿用品商店:Bebe Store
2017/11/23 全球购物
Europcar西班牙:全球汽车租赁领域的领导者
2018/09/17 全球购物
AP澳洲中文网:澳洲正品直邮,包税收件无忧
2019/07/12 全球购物
社区包粽子活动方案
2014/01/21 职场文书
部门2014年度工作总结
2014/11/12 职场文书
幼儿园园长个人总结
2015/03/02 职场文书
运动会通讯稿600字
2015/07/20 职场文书
Python Pandas常用函数方法总结
2021/06/15 Python