uni-popup快速点击卡死现象

最新推荐文章于 2023-09-18 14:37:18 发布

小夏卷编程

最新推荐文章于 2023-09-18 14:37:18 发布

阅读量1k

点赞数 2

文章标签： vue.js 前端 javascript

本文链接：https://blog.csdn.net/a_biggerfish/article/details/126126561

版权

问题：快速点击运行了多个setTimeout，导致页面卡死！

解决办法：找到uni-popup.vue 文件将里面的代码

            open() {
                this.showPopup = true
                this.$nextTick(() => {
                    setTimeout(() => {
                        this.showTrans = true
                    }, 50);
                })
                this.$emit('change', {
                    show: true
                })
            },
            close(type) {
                this.showTrans = false
                this.$nextTick(() => {
                    clearTimeout(this.timer)
                    this.timer = setTimeout(() => {
                        this.$emit('change', {
                            show: false
                        })
                        this.showPopup = false
                    }, 300)
                })
            },

修改为：

      open() {
        this.showPopup = true
        this.showTrans = true
        //在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。
        this.$nextTick(() => {
          this.$emit('change', { show: true, type: this.type })
        })},

      close(type) {
        this.showTrans = false
        this.showPopup = false
        //在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。
        this.$nextTick(() => { this.$emit('change', { show: false, type: this.type })
        })},