La función de hacer clic para copiar se realiza principalmente a través de portapapeles.js
Nota: Al usar clipboard.js en vue, encontré un problema, es decir, si no es un botón de entrada o botón, la copia no se realizará correctamente, los pasos son los siguientes:
1. Importe clipboard.js, el método es el siguiente:
La primera instalación directa de npm: npm install clipboard --save
La segunda: (dirección de descarga: https://clipboardjs.com/ )
2. Introducir en los componentes o páginas requeridos
import Clipboard from "clipboard";
3. Agregue el contenido que necesita ser copiado
解析： data-clipboard-text 后边跟需要复制的内容
Ejemplo:
<button class="pop-btn" data-clipboard-text = "15889745874" @click="copy">复制号码</button>
4. Agregue el método posterior al clic
copy() {
var clipboard = new Clipboard('.pop-btn')
clipboard.on('success', e => {
console.log('复制成功')
// 释放内存
clipboard.destroy()
})
clipboard.on('error', e => {
// 不支持复制
console.log('该浏览器不支持自动复制')
// 释放内存
clipboard.destroy()
})
}