复制到剪贴板，粘贴进微信，换行符失效

问题描述

微信（windows）版本：v2.9.0

windows环境下，使用 copy-to-clipboard 实现 复制到剪贴板，粘贴进微信（windows），换行符失效。

原因

阅读 copy-to-clipboard，clipboard-copy 等 package 源码，发现实现方式是把数据放进 span 的 textContent，但是数据被 span 标签格式化，数据前后发生了改变，导致换行符失效。

也有实现方式是把数据放进 input 的 value，同样数据前后发生了改变，换行符失效。

ps：把复制前后的数据打印进控制台，看起来没有区别，因为控制台对数据进行了转码，如何证明不一样，待研究。（在浏览器的控制台，txt文件，复制到 textarea 转为 charCode 均显示一致。）

同理复现：windows 下，微信聊天框输入换行的文字并复制，浏览器查看元素粘贴进span，然后失焦，然后点击标签复制内容，粘贴进微信聊天框，内容变成了不换行。

解决方案

textarea 天然支持 换行符，使用 textarea 代替 span 或 input。

function copyToClipboard(txt) {
  var textarea = document.createElement("textarea");
  textarea.value = txt;
  document.body.appendChild(textarea);
  textarea.select();
  document.execCommand("copy");
  document.body.removeChild(textarea);
}

whosmeya.com