[vue] Copie y pegue el contenido de la etiqueta div

Vue copiar y pegar contenido de etiqueta div


1. Instalar portapapeles.js

npm install clipboard

2. Introduzca clipboard.js en la página de vue

import Clipboard from 'clipboard';//引入安装复制插件

3. código HTML

 <button
	  class="button"
      data-clipboard-target="#text" <!--这里绑定的是要复制的标签的id-->
      data-clipboard-action="copy" //这个加不加都可以
      @click="btnCopy" <!--这里是触发的方法-->
    >
  复制
</button>
<div id="text">需要复制的内容</div>

4. código vue.js

btnCopy() {
    
    
      let textUrl = new Clipboard('.button');
      textUrl.on('success', (e)=> {
    
    
        this.$message('复制成功');
        textUrl.destroy()
      });
      textUrl.on("error", () => {
    
    
		this.$message('没有复制成功');
        textUrl.destroy();
      });
}

Supongo que te gusta

Origin blog.csdn.net/qq_44854653/article/details/131591894
Recomendado
Clasificación