当涉及选项卡时，是否对从我的 React JS 站点复制/粘贴到 excel 的行为感到困惑？

Question

我在一个网站上工作，其中一项功能是将一些文本复制到剪贴板，以便用户可以将此文本粘贴到他们的 Excel 电子表格中。他们要复制到剪贴板的内容实际上是由制表符分隔的多个值，因此当他们复制到 excel 中时（假设他们将默认文本保留到列功能），它会将文本拆分为多个单元格。

例如，我有这个：

getCopyText() {

   return `a \t b \t b \t ${FAKE_FORECAST_VALUE} \t d \t e`

}

render() {

   return (

       ....

            <CopyToClipboard text={this.getCopyText()}>

              <Button">

                Copy to Clipboard

              </Button>

            </CopyToClipboard>

       ...

   )

}

当我单击按钮将文本复制到剪贴板并将其粘贴到 Excel 中时，它似乎没有响应选项卡，它看起来像空格（也没有将值分隔到列中）。

为了进行完整性检查，我尝试将原始剪贴板字符串粘贴到 Word 中并打开显示制表符。它显示了制表符。

然后我将粘贴的字符串从 Word复制到 Excel 中。我很困惑地看到，如果我将 Word 中的字符串（刚刚从剪贴板粘贴）复制到 Excel 中，它会响应制表符并将文本分成多列。

 

总而言之：

1. 复制到剪贴板 -> 粘贴到 Excel = 似乎不保留选项卡，不将值拆分为列，不起作用

2. 复制到剪贴板 -> 粘贴到 Word（保留选项卡） -> 将粘贴的字符串从 Word 复制到 Excel = 保留选项卡，将值拆分为列

当然，我不希望用户必须将字符串粘贴到其他地方并在粘贴到 Excel 之前重新复制它，但我对这里发生的事情感到非常困惑，特别是因为它看起来像是制表符在字符串中（从剪贴板粘贴到 Word 或从剪贴板粘贴到 vim / 记事本等时可以看到）。有什么我可以从 JS 方面做的事情，或者在字符串中放入一些东西来帮助解决这个问题，这样用户就不必处理它了？

Answer 1

在我发布这个问题一两天后，我实际上找到了这个人的答案，这有助于解释实际发生的事情：here。我仍然不完全确定它是否/如何解释粘贴到 Word 然后从那里复制到 Excel 的工作原理。但是，我确实想指出，对于我的特定用例，我通过确保将纯文本复制到剪贴板而不是将其检测为 HTML 来使复制到剪贴板 -> 粘贴到 excel 功能正常工作。由于我使用的是 CopyToClipboard 依赖项（React 变体），因此只需添加一个选项，该选项可让您指定应将文本复制为 text/plain。CopyToClipboard&nbsp;options&nbsp;: option.format 的描述:String. Optional. Set the MIME type of what you want to copy as. Use text/html to copy as HTML, text/plain to avoid inherited styles showing when pasted into rich text editor.