代码优化:将render类的onPaste方法中的读取剪贴板数据的逻辑提取为工具函数

This commit is contained in:
wanglin2 2023-10-13 16:25:05 +08:00
parent 1fbfe6f5ac
commit ca9e47183d
2 changed files with 32 additions and 18 deletions

View File

@ -22,7 +22,8 @@ import {
createUid,
getNodeDataIndex,
getNodeIndexInNodeList,
setDataToClipboard
setDataToClipboard,
getDataFromClipboard
} from '../../utils'
import { shapeList } from './node/Shape'
import { lineStyleProps } from '../../themes/default'
@ -805,23 +806,12 @@ class Render {
// 读取剪贴板的文字和图片
let text = null
let img = null
if (navigator.clipboard) {
try {
text = await navigator.clipboard.readText()
const items = await navigator.clipboard.read()
if (items && items.length > 0) {
for (const clipboardItem of items) {
for (const type of clipboardItem.types) {
if (/^image\//.test(type)) {
img = await clipboardItem.getType(type)
break
}
}
}
}
} catch (error) {
errorHandler(ERROR_TYPES.READ_CLIPBOARD_ERROR, error)
}
try {
const res = await getDataFromClipboard()
text = res.text
img = res.img
} catch (error) {
errorHandler(ERROR_TYPES.READ_CLIPBOARD_ERROR, error)
}
// 检查剪切板数据是否有变化
// 通过图片大小来判断图片是否发生变化,可能是不准确的,但是目前没有其他好方法

View File

@ -898,3 +898,27 @@ export const setDataToClipboard = data => {
navigator.clipboard.writeText(JSON.stringify(data))
}
}
// 从用户剪贴板中读取文字和图片
export const getDataFromClipboard = async () => {
let text = null
let img = null
if (navigator.clipboard) {
text = await navigator.clipboard.readText()
const items = await navigator.clipboard.read()
if (items && items.length > 0) {
for (const clipboardItem of items) {
for (const type of clipboardItem.types) {
if (/^image\//.test(type)) {
img = await clipboardItem.getType(type)
break
}
}
}
}
}
return {
text,
img
}
}