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

useClickAway

\u4ECB\u7ECD

\u76D1\u542C\u70B9\u51FB\u5143\u7D20\u5916\u90E8\u7684\u4E8B\u4EF6\u3002

\u4EE3\u7801\u6F14\u793A

\u57FA\u672C\u7528\u6CD5

<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 };
  },
};

\u81EA\u5B9A\u4E49\u4E8B\u4EF6

\u901A\u8FC7 eventName \u9009\u9879\u53EF\u4EE5\u81EA\u5B9A\u4E49\u9700\u8981\u76D1\u542C\u7684\u4E8B\u4EF6\u7C7B\u578B\u3002

<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

\u7C7B\u578B\u5B9A\u4E49

type Options = {
  eventName?: string;
};

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

\u53C2\u6570

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C
target	\u7ED1\u5B9A\u4E8B\u4EF6\u7684\u5143\u7D20\uFF0C\u652F\u6301\u4F20\u5165\u6570\u7EC4\u6765\u7ED1\u5B9A\u591A\u4E2A\u5143\u7D20	Element \| Ref<Element> \| Array<Element \| Ref<Element>>	-
listener	\u70B9\u51FB\u5916\u90E8\u65F6\u89E6\u53D1\u7684\u56DE\u8C03\u51FD\u6570	EventListener	-
options	\u53EF\u9009\u7684\u914D\u7F6E\u9879	Options	\u89C1\u4E0B\u8868

Options

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C
eventName	\u76D1\u542C\u7684\u4E8B\u4EF6\u7C7B\u578B	string	`click`

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