alibaba / alibaba/hooks

[RFC] useClipboard

Open
#2,715 6 comments 1 reaction 0 assignees View on GitHub
pr welcomed
Dominant language
TypeScript
Stars
15k
Forks
2.8k
Avg merge
15h 7m
Merged PRs (30d)
2

Description

### Demo

```
const { copyToClipboard, pasteFromClipboard } = useClipboard();
// 复制操作
const handleCopy =async () => {
const displayText = "React 对象111"; // 外部显示的文本
const dataToCopy = { name: "React 对象", value: 123, description: "这是一个测试对象" }; // 要存储的数据
await copyToClipboard(displayText, dataToCopy);
};

// 粘贴操作
const handlePaste = async () => {
const data = await pasteFromClipboard();
setPastedData(data);
};
```

获取粘贴板数据
![image](https://github.com/user-attachments/assets/2a5571d5-6e5a-40c3-8d17-bd676f16c0a9)

在非项目粘贴显示内容
![image](https://github.com/user-attachments/assets/b2de2f56-aa9a-43d6-badd-0d8698358707)

Contributor guide

Open the contributing guide

Research direction

Start from the useClipboard() entry point shown in the demo and compare the copyToClipboard and pasteFromClipboard behavior with the attached examples. Done means the intended clipboard data flow and displayed paste results are defined and work as illustrated.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Feature
Difficulty
5/5
Estimated time
Over a week
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.