模版字符串复制粘贴支持换行

打印 上一主题 下一主题

主题 900|帖子 900|积分 2700

根据后端返回字段,获取对应字段的值,天生模版举行复制粘贴出来!
模版字符串复制粘贴支持换行

  1. 后端返回类型:
  2. const arr = [
  3.         'test',
  4.         'test1',
  5.         'test2',
  6.         'test3',
  7. ]
  8. const copyProp = [
  9.   { prop: 'test', label: '测试' },
  10.   { prop: 'test1', label: '测试1' },
  11.   { prop: 'test2', label: '测试2' },
  12.   { prop: 'test3', label: '测试3' }
  13. ]
  14. template:
  15. <button :title="$lang('一键复制')" class="el-button el-button--text el-button--small" type="button">
  16.      <i class="icon-iconfont iconfont iconbiaodan-chushen font-16" @click="handleCopy(row)"></i>
  17. </button>
  18. script:
  19. // 一键复制
  20.     handleCopy(row) {
  21.       // 处理复制模版
  22.       const templateList = []
  23.       this.arr.map((item) => {
  24.         const [label] = copyProp.filter((i) => i.prop === item).map(v => v.label)
  25.         templateList.push(`${label} : ${row[item] || ''}`)
  26.       })
  27.       templateList.push(this.msg) // 增加后面固定提示语
  28.       const template = '' + `${templateList.join('\n')}`
  29.       oneClickReplication(template)
  30.     },
  31. /**
  32. *
  33. * @param {*} 点击复制
  34. */
  35. export const oneClickReplication = template => {
  36.   var textareaC = document.createElement('textarea')
  37.   textareaC.setAttribute('readonly', 'readonly') // 设置只读属性防止手机上弹出软键盘
  38.   textareaC.value = template
  39.   document.body.appendChild(textareaC) // 将textarea添加为body子元素
  40.   textareaC.select()
  41.   if (document.execCommand('copy')) {
  42.     document.execCommand('copy')
  43.     document.body.removeChild(textareaC)// 移除DOM元素
  44.     vm.$message.success(vm.$lang('复制成功'))
  45.   }
  46. };
复制代码
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

慢吞云雾缓吐愁

金牌会员
这个人很懒什么都没写!

标签云

快速回复 返回顶部 返回列表