vue项目实现 一键复制粘贴 亲测有效

我的项目中需要复制后端返回的xml文件内容，html识别不了换行符，我们使用textarea来展示内同实现带换行格式的展示，另外需要实现对内容的一键复制，复制到剪切板，方便用户粘贴使用，在这里记录实现方法。

不带格式的复制

html（不识别换行）

<Button class="copy" @click="copy">复制</Button>

js

copy (data) {
  let input = document.createElement('input')
  input.value = data
  input.id = 'creatDom'
  document.body.appendChild(input)
  input.select()
  document.execCommand('copy')
  document.body.removeChild(input)
}

带格式（识别换行）

只需要把input换成textarea

copy (data) {
  let textarea = document.createElement('textarea')
  textarea.value = data
  textarea.id = 'creatDom'
  document.body.appendChild(textarea)
  textarea.select()
  document.execCommand('copy')
  document.body.removeChild(textarea)
}