vue 复制链接功能

tech2026-03-18  1

html部分:

<el-table :data="someTabaleData.slice(sizePerPage*(currentPage-1),sizePerPage*currentPage)" border> <el-table-column align="center" prop="contents" label="文章标题"></el-table-column> <el-table-column align="center" prop="optype_name" label="平台"></el-table-column> <el-table-column align="center" prop="usernickme" label="发布账号"></el-table-column> <el-table-column align="center" prop="username" label="发布用户"></el-table-column> <el-table-column align="center" prop="remarks" label="用户备注"></el-table-column> <el-table-column align="center" prop="createtime" label="创建时间"></el-table-column> <el-table-column align="center" prop="fabutime" label="发布时间"></el-table-column> <el-table-column align="center" prop="cate_name" label="文章分类"></el-table-column> <el-table-column align="center" prop="caozuo" label="操作"> <template slot-scope="scope"> <router-link :to="{name:'publishedArticles',params:{id:scope.row.id}}"></router-link> <el-button @click="viewDetail(scope.row)" type="text" size="small">查看</el-button> <el-button @click="copyLink(scope.row)" type="text" size="small">复制链接</el-button> </template> </el-table-column> </el-table>

js部分:

<script> export default{ data(){ return { } }, method:{ copyLink(row){ let url=row.wurl; // 后台接口返回的链接地址 let oInput = document.createElement("input"); inputNode.value = url; document.body.appendChild(inputNode); inputNode.select(); // 选择对象 document.execCommand("Copy"); // 执行浏览器复制命令 inputNode.className = "oInput"; inputNode.style.display = "none"; this.$message.success("复制成功"); }, } } </script>
最新回复(0)