import{o as a,a as n,y as t}from"./vue-libs.b44bc779.js";const e={class:"van-doc-markdown-body"},l=t(`

useClickAway

Intro

Triggers a callback when user clicks outside of the target element.

Usage

Basic Usage

<div ref="root" />

import { ref } from 'vue';
import { useClickAway } from '@vant/use';

export default {
  setup() {
    const root = ref();
    useClickAway(root, () => {
      console.log('click outside!');
    });

    return { root };
  },
};

Custom Event

<div ref="root" />

import { ref } from 'vue';
import { useClickAway } from '@vant/use';

export default {
  setup() {
    const root = ref();
    useClickAway(
      root,
      () => {
        console.log('touch outside!');
      },
      { eventName: 'touchstart' }
    );

    return { root };
  },
};

API

Type Declarations

type Options = {
  eventName?: string;
};

function useClickAway(
  target: Element | Ref<Element | undefined>,
  listener: EventListener,
  options?: Options
): void;

Params

Name	Description	Type	Default Value
target	Target element, support multiple elements	Element \| Ref<Element> \| Array<Element \| Ref<Element>>	-
listener	Callback function when the outside is clicked	EventListener	-
options	Options	Options	`{ eventName: 'click' }`

Options

Name	Description	Type	Default Value
eventName	Event name	string	`click`

`,9),p=[l],h={__name:"use-click-away.en-US",setup(c,{expose:s}){return s({frontmatter:{}}),(d,r)=>(a(),n("div",e,p))}};export{h as default};