添加复制文字的功能

使用npm安装vue-clipboard2

npm install --save vue-clipboard2
npm install vue-layer

将vue-clipboard2引入main.js中

import Vue from 'vue'
import App from './App.vue'
import router from './router.js'
import layer from 'vue-layer'
import 'vue-layer/lib/vue-layer.css'
import VueClipboard from 'vue-clipboard2'

VueClipboard.config.autoSetContainer = true
Vue.use(VueClipboard)
Vue.prototype.$layer = layer(Vue, {
  msgtime: 3
})

Vue.config.productionTip = false
new Vue({
  router,
  render: h => h(App),
}).$mount('#app')

使用

<template>
    <div class="container">
    <button @click="doCopy">Copy!</button>
    </div>
  </template>
 
  <script>
    data() {
      return {
        message: '这是我要copy的内容'
      }
    },
    methods: {
      doCop () {
        this.$copyText(this.message).then(
          e => {
            this.$layer.msg("复制成功");
          },
          e => {
            this.$layer.msg("复制失败");
          }
        )
      }
    }
  </script> 

复制.png