Browse Source

fix: token effect error

pull/6349/head
tangjinzhou 2 years ago
parent
commit
dde2ff140d
  1. 53
      components/_util/cssinjs/hooks/useGlobalCache.tsx
  2. 4
      components/config-provider/index.tsx
  3. 2
      components/locale/index.tsx

53
components/_util/cssinjs/hooks/useGlobalCache.tsx

@ -2,8 +2,7 @@ import { useStyleInject } from '../StyleContext';
import type { KeyType } from '../Cache'; import type { KeyType } from '../Cache';
import useHMR from './useHMR'; import useHMR from './useHMR';
import type { ComputedRef, Ref } from 'vue'; import type { ComputedRef, Ref } from 'vue';
import { onBeforeUnmount, computed, watch } from 'vue'; import { onBeforeUnmount, computed, watch, watchEffect, shallowRef } from 'vue';
import eagerComputed from '../../eagerComputed';
export default function useClientCache<CacheType>( export default function useClientCache<CacheType>(
prefix: string, prefix: string,
@ -13,7 +12,10 @@ export default function useClientCache<CacheType>(
): ComputedRef<CacheType> { ): ComputedRef<CacheType> {
const styleContext = useStyleInject(); const styleContext = useStyleInject();
const fullPath = computed(() => [prefix, ...keyPath.value]); const fullPath = computed(() => [prefix, ...keyPath.value]);
const fullPathStr = eagerComputed(() => fullPath.value.join('_')); const fullPathStr = shallowRef('');
watchEffect(() => {
fullPathStr.value = fullPath.value.join('_');
});
const HMRUpdate = useHMR(); const HMRUpdate = useHMR();
const clearCache = (paths: typeof fullPath.value) => { const clearCache = (paths: typeof fullPath.value) => {
styleContext.cache.update(paths, prevCache => { styleContext.cache.update(paths, prevCache => {
@ -28,36 +30,37 @@ export default function useClientCache<CacheType>(
return [times - 1, cache]; return [times - 1, cache];
}); });
}; };
watch(
() => fullPath.value.slice(),
(_, oldValue) => {
clearCache(oldValue);
},
);
// Create cache
watch(
fullPathStr,
() => {
styleContext.cache.update(fullPath.value, prevCache => {
const [times = 0, cache] = prevCache || [];
// HMR should always ignore cache since developer may change it watch(
let tmpCache = cache; [fullPathStr, fullPath],
if (process.env.NODE_ENV !== 'production' && cache && HMRUpdate) { ([newStr], [oldStr, oldPath]) => {
onCacheRemove?.(tmpCache, HMRUpdate); if (newStr !== oldStr) {
tmpCache = null; if (oldPath) clearCache(oldPath);
} // Create cache
styleContext.cache.update(fullPath.value, prevCache => {
const [times = 0, cache] = prevCache || [];
const mergedCache = tmpCache || cacheFn(); // HMR should always ignore cache since developer may change it
let tmpCache = cache;
if (process.env.NODE_ENV !== 'production' && cache && HMRUpdate) {
onCacheRemove?.(tmpCache, HMRUpdate);
tmpCache = null;
}
// console.log('create');
const mergedCache = tmpCache || cacheFn();
return [times + 1, mergedCache]; return [times + 1, mergedCache];
}); });
}
}, },
{ immediate: true }, { immediate: true },
); );
onBeforeUnmount(() => { onBeforeUnmount(() => {
clearCache(fullPath.value); clearCache(fullPath.value);
}); });
const val = computed(() => styleContext.cache.get(fullPath.value)![1]); const val = computed(() => {
return styleContext.cache.get(fullPath.value)![1];
});
return val; return val;
} }

4
components/config-provider/index.tsx

@ -201,7 +201,9 @@ const ConfigProvider = defineComponent({
dropdownMatchSelectWidth, dropdownMatchSelectWidth,
getPrefixCls, getPrefixCls,
iconPrefixCls, iconPrefixCls,
theme: mergedTheme, theme: computed(() => {
return mergedTheme.value ?? parentContext.theme?.value;
}),
renderEmpty: renderEmptyComponent, renderEmpty: renderEmptyComponent,
getTargetContainer, getTargetContainer,
getPopupContainer, getPopupContainer,

2
components/locale/index.tsx

@ -42,7 +42,7 @@ export interface Locale {
copied?: any; copied?: any;
expand?: any; expand?: any;
}; };
QRCode: { QRCode?: {
expired?: string; expired?: string;
refresh?: string; refresh?: string;
}; };

Loading…
Cancel
Save