模版字符串复制粘贴支持换行
模版字符串复制粘贴支持换行
- 模版字符串复制粘贴支持换行
根据后端返回字段,获取对应字段的值,生成模版进行复制粘贴出来!
模版字符串复制粘贴支持换行
后端返回类型:
const arr = [
'test',
'test1',
'test2',
'test3',
]
const copyProp = [
{ prop: 'test', label: '测试' },
{ prop: 'test1', label: '测试1' },
{ prop: 'test2', label: '测试2' },
{ prop: 'test3', label: '测试3' }
]
template:
<button :title="$lang('一键复制')" class="el-button el-button--text el-button--small" type="button">
<i class="icon-iconfont iconfont iconbiaodan-chushen font-16" @click="handleCopy(row)"></i>
</button>
script:
// 一键复制
handleCopy(row) {
// 处理复制模版
const templateList = []
this.arr.map((item) => {
const [label] = copyProp.filter((i) => i.prop === item).map(v => v.label)
templateList.push(`${label} : ${row[item] || ''}`)
})
templateList.push(this.msg) // 增加后面固定提示语
const template = '' + `${templateList.join('\n')}`
oneClickReplication(template)
},
/**
*
* @param {*} 点击复制
*/
export const oneClickReplication = template => {
var textareaC = document.createElement('textarea')
textareaC.setAttribute('readonly', 'readonly') // 设置只读属性防止手机上弹出软键盘
textareaC.value = template
document.body.appendChild(textareaC) // 将textarea添加为body子元素
textareaC.select()
if (document.execCommand('copy')) {
document.execCommand('copy')
document.body.removeChild(textareaC)// 移除DOM元素
vm.$message.success(vm.$lang('复制成功'))
}
};