最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

[uni

运维笔记admin26浏览0评论

[uni

[uni

一般用节流防抖的方式处理,
这里通过vue的自定义指令方式也可以

实现:

import Vue from 'vue'
// 自定义指令防止按钮重复点击 v-debounceconst debounce = {install(Vue) {// 防止重复点击Vue.directive('debounce', {inserted: function(el, binding) {el.addEventListener('click', () => {if (el.style['pointer-events'] != 'none') {el.style['pointer-events'] = 'none';setTimeout(() => {el.style['pointer-events'] = 'all';}, binding.value || 1500)}})}})}
}const tool = {debounce,
}
export default tool;

main.js中使用一下

import tool from "@/common/js/tool.js"
Vue.use(tool.debounce)

应用:

		<view class="debounce-view" @click="debounceClick(3)" v-debounce>防重复点击</view>
发布评论

评论列表(0)

  1. 暂无评论