我需要将一些文本复制到剪贴板(我们使用的是 React JS，但更通用的方法也可以)，但我当前遇到的问题是文本需要存在于文档中命令选择/复制它。
我们想要复制到剪贴板的文本并不是我们想要实际显示在页面上的内容。我尝试查看类似的问题:react: copy component state value to clipboard without dummy element .
基本上做这样的事情:
function copyToClipboard(text){
var dummy = document.createElement("input");
document.body.appendChild(dummy);
dummy.setAttribute('value', createdMyTextHere);
// dummyElement.style.display = "none" - doesn't work because then we can't select from it
dummy.select();
document.execCommand("copy");
document.body.removeChild(dummy);
}
我做了OP所做的事情，但问题是在某些情况下(例如在极端负载下或者如果在添加元素和从文档中删除元素之间存在某种延迟)元素将显示得非常明显短暂然后消失，导致屏幕上出现一点闪烁。
我尝试将元素设置为 hidden 或设置 display:none 但 hidden 仍然会导致为元素创建空间，并且display:none 导致我们根本无法从元素中进行选择。
关于如何解决此问题有什么建议吗？
最佳答案
我建议this 。它是一个 npm 包，可让您将任何文本复制到客户端的剪贴板。 要复制任何文本:
<CopyToClipboard text={'Your custom text here'}
onCopy={() => this.setState({copied: true})}>
<span>Copy to clipboard with span</span>
</CopyToClipboard>
关于javascript - 在 React JS 中将值复制到剪贴板而不显示虚拟元素，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/62839647/