如何实现点击按钮复制表格对应一行的内容?

如题,表格用到了elementui的表格组件,前端框架为vue。现在在每行内容后面加上一个复制按钮,点击后可以复制对应的那一行内容,这该如何实现呢?

阅读 3.2k
1 个回答

import VueClipboard from 'vue-clipboard2'
Vue.use(VueClipboard)
<el-table-column label="操作">
    <template slot-scope="scope">
         <el-button
        class="clipboard"
        round
        size="mini"
        type="success"
        plain
        v-clipboard:copy="scope.row.id"
        v-clipboard:success="onCopy"
        v-clipboard:error="onError"
        >点击复制</el-button
      >  
   </template>
</el-table-column>

  
      // 复制成功
    onCopy() {
      this.$message.success('已复制到剪贴板!')
    },
    // 复制失败
    onError() {
      this.$message.warning('复制失败,请稍后再试试!')
    },

参考资料

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题