zoukankan      html  css  js  c++  java
  • vue中使用剪切板插件 clipboard.js

    vue中使用剪切板需要借助一个插件,clipboard,使用方法还是很简单的,先下载,然后引入:

    npm i clipboard -S

    //引入
    import Clipboard from 'clipboard';
    
    下面就是使用了,比如说,比较常见的是,上面一行文字,下面有一个复制的按钮,
    <p id="share-code">{{init.code}}</p>
    <button class="copy-btn" data-clipboard-action="copy" data-clipboard-target="#share-code" @click="copy">copy</button>
    
    <script> copy() { if(!this.init) return; var clipboard = new Clipboard('.copy-btn') clipboard.on('success', e => { console.log('复制成功') this.toast('copy success'); // 释放内存 clipboard.destroy(); }) clipboard.on('error', e => { // 不支持复制       //console.log('该浏览器不支持自动复制') // 释放内存 clipboard.destroy() }) } }, </script>
  • 相关阅读:
    随机ID添加
    学生ID查询
    node.js基础
    冒泡排序
    循环判断语句
    vue.js详细教程--优优优
    final注意事项
    HashMap Hashtable区别
    java中间件
    JSP错误页面
  • 原文地址:https://www.cnblogs.com/ysla/p/11530815.html
Copyright © 2011-2022 走看看