美文网首页
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