vue 如何实现复制到粘帖板

vue-clipboard2 

A simple vuejs 2 binding for clipboard.js

Install

npm install --save vue-clipboard2 or use dist/vue-clipboard.min.js without webpack

Usage

For vue-cli user:

import Vue

import VueClipboard from 'vue-clipboard2'

 

Vue.use(VueClipboard)

For standalone usage:

<script src="vue.min.js"></script>

<script src="dist/vue-clipboard.min.js"></script>

Sample

<div id="app"></div>

 

<template id="t">

  <div class="container">

    <input type="text" v-model="message">

    <button type="button"

      v-clipboard:copy="message"

      v-clipboard:success="onCopy"

      v-clipboard:error="onError">Copy!button>

  div>

template>

 

<script>

new Vue({

  el: '#app',

  template: '#t',

  data: function () {

    return {

      message: 'Copy These Text'

    }

  },

  methods: {

    onCopy: function (e) {

      alert('You just copied: ' + e.text)

    },

    onError: function (e) {

      alert('Failed to copy texts')

    }

  }

})

script>