13.Vue+Element UI实现复制内容

标签：v-model   nbsp   页面   message   方法   copy   实现   strong   mes   

1. 安装依赖包：

　　npm  install vue-clipboard2  --save

2. main.js中引入

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

3.页面中使用：

　　<el-input v-model="address" :title="address"></el-input> （:title的变量address需要在data中声明一个）
　　<a v-clipboard:copy="address" v-clipboard:success="onCopy" v-clipboard:error="onError">复制</a> (此处的:copy对应的数据跟要复制内容的变量是一致的)

4.Methods下的两个方法：
　　onCopy(e){ 　　 // 复制成功
　　　　this.$message({
　　　　　　message:‘复制成功！‘,
　　　　　　type:‘success‘
　　　　})
　　},
　　onError(e){　　 // 复制失败
　　　　this.$message({
　　　　　　message:‘复制失败！‘,
　　　　　　type:‘error‘
　　　　})
　　},

13.Vue+Element UI实现复制内容

标签：v-model   nbsp   页面   message   方法   copy   实现   strong   mes   

原文地址：https://www.cnblogs.com/xintao/p/11024481.html