alibaba / alibaba/hooks

[useClickAway] 支持传入事件监听选项

Open
#2,770 0 comments 0 reactions 0 assignees View on GitHub
feature
Dominant language
TypeScript
Stars
15k
Forks
2.8k
Avg merge
15h 7m
Merged PRs (30d)
2

Description

背景:如果有元素的点击事件中阻止了冒泡,会导致 `useClickAway` 无法捕捉到此次点击

代码:
```tsx
import React, { useState, useRef } from "react";
import { useClickAway } from "ahooks";

export default () => {
const [counter, setCounter] = useState(0);

const ref = useRef(null);

useClickAway(() => setCounter((s) => s + 1), ref);

return (



box1

e.stopPropagation()}
>
box2

counter: {counter}



);
};
```

期望:支持传入事件监听选项如 capture 等参数,改变事件捕获时机

Contributor guide

Open the contributing guide

Research direction

Start at the useClickAway entry point and trace how it registers document click events. Add support for event-listener options such as capture so callers can change the event-capture timing, then verify the supplied stopPropagation example behaves as expected.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.