h5的复制功能的使用,Clipboard.js的使用,主要是在app里面使用

最新推荐文章于 2025-06-25 10:54:20 发布

丑心疼

最新推荐文章于 2025-06-25 10:54:20 发布

阅读量1.2k

点赞数

CC 4.0 BY-SA版权

文章标签：移动开发 json

原文链接：http://www.cnblogs.com/antyhouse/p/10137773.html

本文介绍如何在Vue.js项目中使用Clipboard.js插件实现文本复制功能。具体包括安装配置、代码示例及不同环境下（如App内）的调用方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

app中使用,框架用的是vue.js
1.显示要下载这个Clipboard.js插件

package-lock.json里面

 "clipboard-polyfill": {
      "version": "2.3.0",
      "resolved": "https://registry.npmjs.org/clipboard-polyfill/-/clipboard-polyfill-2.3.0.tgz",
      "integrity": "sha1-IQMYRMHsJLOat5QNuh6whgE0vlk=",
      "requires": {
        "es6-promise": "4.1.1"
      }
    },

3.在要做复制功能的页面
template

<div class="copy-number" @click.stop="copyBankNum(cardItem.bankCardNo)">复制</div>

  import clipboard from 'clipboard-polyfill'
  copyBankNum (cardNum) {
        if (this.GLOBAL.isInApp) {
          window.JSBridge.copyToClipboard(cardNum) //这里一定要传哦,不然会显示undefined
        } else {
          alert(cardNum)
          clipboard.writeText(cardNum)
          Toast({
            iconClass: 'icon icon-success',
            message: '复制成功',
            duration: 500
          })
        }
      }

转载于:https://www.cnblogs.com/antyhouse/p/10137773.html