diff --git a/src/components/InfoDialog.vue b/src/components/InfoDialog.vue
index ba2d3f8..d1f3e31 100644
--- a/src/components/InfoDialog.vue
+++ b/src/components/InfoDialog.vue
@@ -7,17 +7,6 @@
上面是预览区,下面是操作区,要改哪里点哪里就行。
-
-
-
- 目前还是只支持Edge或Chrome浏览器😩如果有大佬想要增加适配欢迎pr🥺
-
-
- Safari和火狐目前的问题在于生成图片时,为了生成更清晰的图片,我搞了一个尺寸两倍的display: none的组件丢给dom-to-image,此时需要给dom-to-image传一个Element的宽高,但是在Safari和火狐上获取不到这个宽高。
- 另外火狐默认不支持ClipboardItem,没办法复制。
-
-
-
diff --git a/src/composables/useHiddenElementStyle.ts b/src/composables/useHiddenElementStyle.ts
index e266913..9dd1ee1 100644
--- a/src/composables/useHiddenElementStyle.ts
+++ b/src/composables/useHiddenElementStyle.ts
@@ -1,7 +1,7 @@
import type { Fn, MaybeComputedElementRef, MaybeElement, UnRefElementReturn } from "@vueuse/core";
export function useHiddenElementStyle(target: MaybeComputedElementRef) {
- const style = ref({} as CSSStyleDeclaration);
+ const style = ref>({} as any);
function updateStyle(el: UnRefElementReturn) {
if (!el) { return; }
@@ -15,12 +15,12 @@ export function useHiddenElementStyle(target: MaybeComputedElementRef) {
el.style.display = "unset";
el.style.visibility = "hidden";
el.style.position = "absolute";
- style.value = { ...window.getComputedStyle(el) };
+ style.value = transformCSSProperties(window.getComputedStyle(el));
el.style.position = position;
el.style.visibility = visibility;
el.style.display = display;
} else {
- style.value = { ...window.getComputedStyle(el) };
+ style.value = transformCSSProperties(window.getComputedStyle(el));
}
}
@@ -51,6 +51,17 @@ export function useHiddenElementStyle(target: MaybeComputedElementRef) {
};
}
+function transformCSSProperties(styles: CSSStyleDeclaration) {
+ const style: Record = {};
+ const length = styles.length;
+ for (let i = 0; i < length; i++) {
+ const prop = styles[i];
+ const value = styles.getPropertyValue(prop);
+ style[prop] = value;
+ }
+ return style as Record;
+}
+
function createStyleSelector(options?: { style?: CSSStyleDeclaration; computedStyle?: CSSStyleDeclaration }) {
const { style = {}, computedStyle = {} } = options || {};
return {