我的项目需要
- 点击文字实现复制粘贴性能
我的项目筹备
- vue
我的项目代码
-
不应用插件:尽管几行代码就能够实现,不过官网文档显示 execCommand 根本被弃用,不举荐应用
<template id="test"> <el-button v-for="item in copiedData" :key="id" type="text" size="mini" @click="copy(item.id)"> 复制 ID</el-button> <span @click="copy" v-text="data[0].name" ref="copiedElement"></span> </template> <script> export default { el: "#test", data() { return { copiedID:'', copiedData: [{ id: 1, name: "a"}, {id: 2, name: "b"}, {id: 3, name: "c"}, ], }; }, methods: {copy(item) { this.copiedID = item? item.id:this.$refs.copiedElement.innerText; const input = document.createElement("input"); input.value = this.copiedID; document.body.appendChild(input); input.select(); document.execCommand("Copy"); document.body.removeChild(input); }, }, } </script>
- 应用插件
待更 …
相干链接
- MDN 文档: https://developer.mozilla.org…