1. 程式人生 > >vue實現複製功能(專案使用)

vue實現複製功能(專案使用)

安裝依賴

npm install --save vue-clipboard2

用法:

import Vue
import VueClipboard from 'vue-clipboard2'
 
Vue.use(VueClipboard)

Demo:

<template id="demo">
  <div class="container">
    <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> new Vue({ el: '#app', template: '#demo', data: function () { return { message: '啦啦啦,這是複製的內容!' } }, methods: { onCopy:
function (e) { console.log('你剛剛複製: ' + e.text) }, onError: function (e) { console.log('無法複製文字!') } } }) </script>

後記:vue簡直把懶惰發揮到了極致,為棒棒的自己點贊