1 引入模板clipboard
官网: https://www.npmjs.com/package/vue-clipboard#installation

npm install clipboard --save

2 使用的地方引入
引包

import Clipboard from 'clipboard'

HTML

<div  class="code"  :data-clipboard-text="userInfo.account"  @click="copy">
        <div>{{userInfo.account}}</div>
        <div>(点击复制)</div>
      </div>

方法

    /**
   * 复制功能
   */
    copy () {
      var clipboard = new Clipboard('.code')
      clipboard.on('success', e => {
        console.log('复制成功', e)
        Toast({
          message: '复制成功'
        })
        // 释放内存
        clipboard.destroy()
      })
      clipboard.on('error', e => {
        // 不支持复制
        Toast({
          message: '手机权限不支持复制功能'
        })
        console.log('该浏览器不支持自动复制')
        // 释放内存
        clipboard.destroy()
      })
    },

Tips:【小程序云开发】中高级前端面试题库(源码:小程序中联系我哟)。
---------- 创作不易,感谢大家,请多多支持!
在这里插入图片描述

Logo

前往低代码交流专区

更多推荐