VUE implements copy-to-clipboard functionality:

The first method vuE-Clipboard2:1, install vue-Clipboard2 plug-in

npm install --save vue-clipboard2
Copy the code

2, main.js is introduced

import VueClipboards from 'vue-clipboard2'
Vue.use(VueClipboards);
Copy the code

3. Use examples

<el-button type="text" class="password-input" v-clipboard:copy="developPass.password" v-clipboard:success="onCopy" V-clipboard :error="onError" > </el-button> // Copy the input through v-clipboard:copy. OnCopy: function (e) {console.log(' Copy succeeded! ')}, onError: function (e) {console.log(' Copy failed! ')Copy the code

This method does not support data processing before copying to the clipboard. I don’t know what the method is, but I will make a note and simply handle the copying to the clipboard. Please understand ~

The second method of replication

The replication action uses the VUE response function approach, which makes it possible to control the data before replication. Use examples:

Share (val) {this.handleData(val) this.$copyText(this.message).then(function (e) {alert('Copied')}, Function (e) {alert('Can not copy')})}, handleData(val){this.message = this.message + ' '+ val}Copy the code