如何实现
废话不多说,直接上代码
const [copiedStates, setCopiedStates] = useState({});
const handleCopy = (text) => {
if (navigator.clipboard && window.isSecureContext) {
navigator.clipboard
.writeText(text)
.then(() => {
message.success('复制成功', 1.5);
setCopiedStates((prevStates) => ({
...prevStates,
[text]: true,
}));
// 这里是给每一个复制按钮的一个状态
setTimeout(
() =>
setCopiedStates((prevStates) => ({
...prevStates,
[text]: false,
})),
1500
);
})
.catch((err) => {
message.error('复制失败');
});
} else {
const textarea = document.createElement('textarea');
textarea.value = text;
textarea.style.position = 'fixed';
document.body.appendChild(textarea);
textarea.select();
try {
const successful = document.execCommand('copy');
if (successful) {
message.info('复制成功', 1.5);
setCopiedStates((prevStates) => ({
...prevStates,
[text]: true,
}));
setTimeout(
() =>
setCopiedStates((prevStates) => ({
...prevStates,
[text]: false,
})),
1500
);
} else {
message.error('复制失败');
}
} catch (err) {
message.error('复制失败');
}
document.body.removeChild(textarea);
}
};
完成