WeakMap-gestützte benutzerdefinierte Vue-Direktive für entkoppelte Ereignis-Streams

const directiveStates = new WeakMap();
 
export const vEventStream = {
  mounted(el, binding) {
    const handler = (event) => {
      if (binding.value && typeof binding.value === 'function') {
        binding.value(event);
      }
    };
    directiveStates.set(el, handler);
    el.addEventListener(binding.arg || 'click', handler);
  },
  unmounted(el, binding) {
    const handler = directiveStates.get(el);
    if (handler) {
      el.removeEventListener(binding.arg || 'click', handler);
      directiveStates.delete(el);
    }
  }
};