美文网首页
vue 前端节流

vue 前端节流

作者: 苏苡 | 来源:发表于2019-04-01 17:43 被阅读0次

/**

    * 函数节流    方法封装

    * @param fn

    * @param interval

    * @returns {Function}

    * @constructor

    */

    Throttle (fn, t) {

        let last

        let timer

        let interval = t || 500

        return function () {

            let args = arguments

            let now = +new Date()

            if (last && now - last < interval) {

                clearTimeout(timer)

                timer = setTimeout(() => {

                    last = now

                    fn.apply(this, args)

                }, interval)

            } else {

                last = now

                fn.apply(this, args)

            }

        }

    }

//  方法使用:

EG:  (外加二次弹框确认)

 fluteBeputin: util.Throttle(function () {

                let arr = []

                arr.push(arg0.productId)

                this.$confirm('操作将选中的产品加入产品库,请确认是否执行?', '确认信息', {

                    distinguishCancelAndClose: true,

                    confirmButtonText: '确认',

                    cancelButtonText: '取消'

                })

                    .then(() => {

                        let params = {

                            productIdList:arr,

                        }

                        util.request({

                            method: 'post',

                            interface: 'aaaaa',

                            data: params

                        }).then(res => {

                            if (res.result.success == '1') {

                                this.$message.success(res.result.message)

                            } else {

                                this.$message.error(res.result.message)

                            }

                        })

                    })

                    .catch(action => {

                        this.$message({

                            type: 'info',

                            message: action === 'cancel'

                                ? '您已取消入库'

                                : '停留在当前页面'

                        })

                });

            // },       

            }, 3000),

相关文章

  • vue 前端节流

    /** * 函数节流 方法封装 * @param fn * @param interval ...

  • vue项目实现导入/导出Excel

    前端方案 首先安装依赖包 前端实现方案 后端处理导出 前端通过字节流或者url实现导出,字节流方式导出的文件方式可...

  • Vue中使用 Lodash.throttle 来做节流

    Vue中使用 Lodash.throttle 来做节流 在Vue中,有时需要对ajax请求提交进行节流操作.这时候...

  • 前端性能优化:手写实现节流防抖

    前端性能优化:手写实现节流防抖 本文首发于 前端性能优化:手写实现节流防抖[https://gitee.com/r...

  • 节流 vue

    节流: 触发高频事件后n秒内只执行一次,所以节流会稀释函数的执行频率。n秒内再次触发也不会执行 // 相当于人进大...

  • How to use symfony's compone

    采用框架:codeIgniter前端:Vue js 因使用 Vue js 与 element ui 实现前端,使用...

  • vue入门——大前端

    大前端进阶 前端三剑客:HTML+CSS+JS 前端框架:jQuery、BootStrap、Vue vue的思想是...

  • 前端日常——节流

    一、什么是节流 当持续触发事件时,在规定时间段内只调用一次回调函数。如果在规定时间内又触发了该事件,则什么都不做,...

  • 前端节流

    前端节流(规定时间内只出发一次,规定时间内再次触发则无效)

  • 在 Vue 中使用lodash对事件进行防抖和节流

    事件节流和防抖是提高性能或降低网络开销的好方法。虽然 Vue 1曾经支持对事件的节流和防抖,但是在Vue 2中为了...

网友评论

      本文标题:vue 前端节流

      本文链接:https://www.haomeiwen.com/subject/beqbbqtx.html