1.权限指令

// 注册一个全局自定义权限指令 `v-permission`
Vue.directive('permission', {
	inserted: function(el, binding, vnode) {
		const {
			value
		} = binding; // 指令传的值
		// 'user:edit:phone','sysData:sample'
		const permissions = ['user:edit:address', 'sysData:entrust', 'sysData:flow']; // 自己拥有的所有权限

		if (value && value instanceof Array && value.length > 0) {
			const permissionFlag = value; // 元素上的权限
			const hasPermissions = permissions.some(permission => {
				return permissionFlag.includes(permission)
			})

			if (!hasPermissions) {
				el.parentNode && el.parentNode.removeChild(el)
			}
		} else {
			uni.showToast({
				title: '请设置操作权限标签值',
				icon: 'none'
			})
		}
	}
})

1.1模板代码-->使用

    <button v-permission="['user:edit:address','user:edit:phone']">自定义权限指令</button>
	<view class="tabs">
		<view v-permission="['sysData:entrust']">委托单</view>
		<view v-permission="['sysData:flow']">流转卡</view>
		<view v-permission="['sysData:sample']">样品标签</view>
	</view>

1.1运行结果

2. 防止连点指令

// 注册一个全局自定义防抖指令 `v-debounce`  连点多次只执行最后一次
Vue.directive('debounce', {
	inserted: function(el, binding, vnode) {
		let timer;
		el.addEventListener('click', () => {
			if (timer) {
				clearTimeout(timer)
			}
			timer = setTimeout(() => {
				binding.value()
			}, binding.arg || 500)
		})
	}
})

2.1模板代码-->使用

<button v-debounce:500="customFunc">自定义防抖指令</button>