美文网首页
VUE实现复制到粘帖板功能copy

VUE实现复制到粘帖板功能copy

作者: 皇甫贝 | 来源:发表于2019-06-18 17:42 被阅读0次

1.安装vue-clipboard

npm install --save vue-clipboard2

2.main.js引入

import VueClipboards from 'vue-clipboards2'
Vue.use(VueClipboards);

3.案例

<template>
  <div class="anli">
    <input type="text" v-model="message">
    <button type="button" 
     v-clipboard:copy="message"
     v-clipboard:success="onCopy"
     v-clipboard:error="onError">复制</button>
  </div>
</template>
<script>
export default {
  data () {
    return {
      message: '复制目标'
    }
  },
  methods: {
    onCopy: function (e) {
      console.log('复制---成功!')
    },
    onError: function (e) {
      console.log('复制---失败!')
    }
  }
}
</script>

相关文章

网友评论

      本文标题:VUE实现复制到粘帖板功能copy

      本文链接:https://www.haomeiwen.com/subject/kkkqqctx.html