网站升级页面连接设置百度seo推广首选帝搜软件
一、需求说明
在项目中 点击按钮 复制 某行文本是很常见的 应用场景,
在 Vue 项目中实现 复制功能 需要借助 vue-clipboard2 插件。
二、代码实现
1、安装 vue-clipboard2 依赖
( 不行的话可以切换成淘宝镜像源 npm config set registry https://registry.npm.taobao.org )
npm install --save vue-clipboard2
2、在 main.js 文件中全局引入插件
示例代码如下:
import Vue from 'vue'
import VueClipBoard from 'vue-clipboard2'
Vue.use(VueClipBoard)
3、在 vue 文件中使用
<template><div><el-button@click="onCopy">复制</el-button></div>
</template><script>
export default {data() {return {text: "这是一段复制的文本",};},methods: {onCopy() {this.$copyText(this.text).then(e=>{console.log('复制成功:', e);},e=>{console.log('复制失败:', e);})}}
};
</script>