test/ant-design-vue
1
0
Fork 0
mirror of https://gitee.com/ant-design-vue/ant-design-vue.git synced 2024-11-29 18:48:32 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

fix: support shadow dom, close #6912

Browse Source
This commit is contained in:
tangjinzhou 2023-09-10 10:36:30 +08:00
parent d0f7c34497
commit a6c945caaa
1 changed files with 11 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
components/_util/cssinjs/StyleContext.tsx
View File

@ -4,7 +4,6 @@ import CacheEntity from './Cache';
import type { Linter } from './linters/interface';
import type { Transformer } from './transformers/interface';
import { arrayType, booleanType, objectType, someType, stringType, withInstall } from '../type';
import initDefaultProps from '../props-util/initDefaultProps';
export const ATTR_TOKEN = 'data-token-hash';
export const ATTR_MARK = 'data-css-hash';
export const ATTR_CACHE_PATH = 'data-cache-path';
@ -25,7 +24,10 @@ export function createCache() {
(style as any)[CSS_IN_JS_INSTANCE] = (style as any)[CSS_IN_JS_INSTANCE] || cssinjsInstanceId;
// Not force move if no head
document.head.insertBefore(style, firstChild);
// Not force move if no head
if ((style as any)[CSS_IN_JS_INSTANCE] === cssinjsInstanceId) {
document.head.insertBefore(style, firstChild);
}
});
// Deduplicate of moved styles
@ -83,12 +85,16 @@ const defaultStyleContext: StyleContextProps = {
defaultCache: true,
hashPriority: 'low',
};
// fix: https://github.com/vueComponent/ant-design-vue/issues/6912
export const useStyleInject = () => {
return inject(StyleContextKey, shallowRef({ ...defaultStyleContext }));
return inject(StyleContextKey, shallowRef({ ...defaultStyleContext, cache: createCache() }));
};
export const useStyleProvider = (props: UseStyleProviderProps) => {
const parentContext = useStyleInject();
const context = shallowRef<Partial<StyleContextProps>>({ ...defaultStyleContext });
const context = shallowRef<Partial<StyleContextProps>>({
...defaultStyleContext,
cache: createCache(),
});
watch(
[() => unref(props), parentContext],
() => {
@ -144,7 +150,7 @@ export const StyleProvider = withInstall(
defineComponent({
name: 'AStyleProvider',
inheritAttrs: false,
props: initDefaultProps(styleProviderProps(), defaultStyleContext),
props: styleProviderProps(),
setup(props, { slots }) {
useStyleProvider(props);
return () => slots.default?.();