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

useEventListener

\u4ECB\u7ECD

\u65B9\u4FBF\u5730\u8FDB\u884C\u4E8B\u4EF6\u7ED1\u5B9A\uFF0C\u5728\u7EC4\u4EF6 mounted \u548C activated \u65F6\u7ED1\u5B9A\u4E8B\u4EF6\uFF0Cunmounted \u548C deactivated \u65F6\u89E3\u7ED1\u4E8B\u4EF6\u3002

\u4EE3\u7801\u6F14\u793A

\u57FA\u672C\u7528\u6CD5

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

export default {
  setup() {
    // \u5728 window \u4E0A\u7ED1\u5B9A resize \u4E8B\u4EF6
    // \u672A\u6307\u5B9A\u76D1\u542C\u5BF9\u8C61\u65F6\uFF0C\u9ED8\u8BA4\u4F1A\u76D1\u542C window \u7684\u4E8B\u4EF6
    useEventListener('resize', () => {
      console.log('window resize');
    });

    // \u5728 body \u5143\u7D20\u4E0A\u7ED1\u5B9A click \u4E8B\u4EF6
    useEventListener(
      'click',
      () => {
        console.log('click body');
      },
      { target: document.body }
    );
  },
};

API

\u7C7B\u578B\u5B9A\u4E49

type Options = {
  target?: EventTarget | Ref<EventTarget>;
  capture?: boolean;
  passive?: boolean;
};

function useEventListener(
  type: string,
  listener: EventListener,
  options?: Options
): void;

\u53C2\u6570

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C
type	\u76D1\u542C\u7684\u4E8B\u4EF6\u7C7B\u578B	string	-
listener	\u4E8B\u4EF6\u56DE\u8C03\u51FD\u6570	EventListener	-
options	\u53EF\u9009\u7684\u914D\u7F6E\u9879	Options	-

Options

\u53C2\u6570	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C
target	\u7ED1\u5B9A\u4E8B\u4EF6\u7684\u5143\u7D20	EventTarget \| Ref<EventTarget>	`window`
capture	\u662F\u5426\u5728\u4E8B\u4EF6\u6355\u83B7\u9636\u6BB5\u89E6\u53D1	boolean	`false`
passive	\u8BBE\u7F6E\u4E3A `true` \u65F6\uFF0C\u8868\u793A `listener` \u6C38\u8FDC\u4E0D\u4F1A\u8C03\u7528 `preventDefault`	boolean	`false`

`,8),l=[d],h={__name:"use-event-listener.zh-CN",setup(c,{expose:s}){return s({frontmatter:{}}),(p,i)=>(t(),n("div",e,l))}};export{h as default};