【发布时间】:2017-07-21 22:40:31
【问题描述】:
我正在尝试使用React-Copy-To-Clipboard 为我的应用程序创建复制到剪贴板功能,该功能将以制表符分隔的格式将一些数据行从表格复制到剪贴板,Excel 将正确粘贴.
即用 '\t' 和每行末尾的 '\n' 连接每个行项。
(向因我使用咖啡脚本而冒犯的任何人道歉)
convertToTabSeparated : (rows) ->
dataRows =
rows
.map (row) -> row.join('\t')
.join('\n')
return dataRows
此粘贴的输出看起来完全符合其应有的效果: - 在控制台上 - 在文本编辑器中 - 即使在 Excel 桌面中使用“特殊粘贴 > 粘贴值”(或在 Google 电子表格中使用类似的特殊粘贴)。
问题是简单的、非特殊的粘贴到 Excel 中会导致所有值都粘贴到一个单元格中。
更加混乱,当我使用云版本的 MS Excel 时,情况并非如此 - 使用常规粘贴绝对可以正常工作。
另一件事:当我粘贴到文本编辑器中,然后再次复制并将结果重新粘贴到 Excel 中时,它在所有情况下都可以正常工作。
那么:有谁知道反应复制到剪贴板组件可能会导致 \t 和 \n 在进行常规粘贴时无法正确注册的任何字符/格式问题?
找到解决方案,如下: 似乎有问题的 React 库使用周围的 html 元素将数据复制到剪贴板,而 Excel 并不热衷于此。 我决定将我自己的副本添加到剪贴板 DOM 方法,如下所示,使用相同的方法,但使用 textarea 而不是 span,并且选择方法略有不同。看起来效果很好。
copyToClipboard : (text) ->
textArea = document.createElement("textarea")
textArea.style.position = 'fixed'
textArea.style.top = 0
textArea.style.left = 0
textArea.style.width = '2em'
textArea.style.height = '2em'
textArea.style.padding = 0
textArea.style.border = 'none'
textArea.style.outline = 'none'
textArea.style.boxShadow = 'none'
textArea.style.background = 'transparent'
textArea.value = text
document.body.appendChild(textArea)
textArea.select()
try
successful = document.execCommand 'copy'
msg = successful ? 'successful' : 'unsuccessful'
log 'Copying text command was ' + msg
catch err
alert 'Unable to copy'
document.body.removeChild textArea
【问题讨论】:
-
您的解决方案对我有用,谢谢!
标签: excel reactjs copy-paste