@tencentcloud/roomkit-web-vue3/src/TUIRoom/directives/vClickOutside.ts

<h1 align="center"> TUIRoomKit</h1> Conference (TUIRoomKit) is a product suitable for multi-person audio and video conversation scenarios such as business meetings, webinars, and online education. By integrating this product, you can add room management,

const nodeMap = new Map();

const vClickOutside = {
  mounted(el: HTMLElement, binding: any) {
    const listenerFunction = (event: any) => {
      if (el.contains(event.target)) {
        return;
      }
      if (binding.value && typeof binding.value === 'function') {
        binding.value(event);
      }
    };
    if (!nodeMap.has(el)) {
      nodeMap.set(el, []);
    }
    const nodeCallbackList = nodeMap.get(el);
    nodeCallbackList.push(listenerFunction);
    document.addEventListener('click', listenerFunction);
    document.addEventListener('touchend', listenerFunction);
  },
  unmounted(el: HTMLElement) {
    const nodeCallbackList = nodeMap.get(el);
    nodeCallbackList.forEach((callback: any) => {
      document.removeEventListener('click', callback);
      document.addEventListener('touchend', callback);
    });
  },
};

export default vClickOutside;