vue-clipboard2 實現複製粘貼

1.先下載vue-clipboard2

cnpm install vue-clipboard2 --save-dev
複製代碼

2.在main.js引入配置

// 複製到粘貼板插件
import VueClipboard from 'vue-clipboard2'
VueClipboard.config.autoSetContainer = true // add this line
Vue.use(VueClipboard)
複製代碼

3.在組件裏面的用法

html
<!--v-clipboard:copy="要複製的內容"-->
<!-- v-clipboard:success="onCopy",複製成功執行的函數-->
<!--v-clipboard:error="onError",複製失敗執行的函數-->
<div class="footerButton copyBank" v-clipboard:copy="b.BankNo" v-clipboard:success="onCopy" v-clipboard:error="onError">
                	{{$t("m.recharge.copyBank")}}
</div>

複製代碼
js
//複製成功執行的函數
onCopy(e) {
    this.isShowCopy=true;
    this.showCopyResult=this.$t("m.recharge.copySuccess");
    },
//複製失敗執行的函數
onError(e) {
    this.isShowCopy=true;
    this.showCopyResult=this.$t("m.recharge.copyFail");
},
複製代碼

參考連接html

相關文章
相關標籤/搜索