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 useHMR from './useHMR';
import type { ComputedRef, Ref } from 'vue';
import { onBeforeUnmount, computed, watch } from 'vue';
import eagerComputed from '../../eagerComputed';
import { onBeforeUnmount, computed, watch, watchEffect, shallowRef } from 'vue';
export default function useClientCache<CacheType>(
prefix: string,
@ -13,7 +12,10 @@ export default function useClientCache<CacheType>(
): ComputedRef<CacheType> {
const styleContext = useStyleInject();
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 clearCache = (paths: typeof fullPath.value) => {
styleContext.cache.update(paths, prevCache => {
@ -28,36 +30,37 @@ export default function useClientCache<CacheType>(
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
let tmpCache = cache;
if (process.env.NODE_ENV !== 'production' && cache && HMRUpdate) {
onCacheRemove?.(tmpCache, HMRUpdate);
tmpCache = null;
}
watch(
[fullPathStr, fullPath],
([newStr], [oldStr, oldPath]) => {
if (newStr !== oldStr) {
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 },
);
onBeforeUnmount(() => {
clearCache(fullPath.value);
});
const val = computed(() => styleContext.cache.get(fullPath.value)![1]);
const val = computed(() => {
return styleContext.cache.get(fullPath.value)![1];
});
return val;
}

4
components/config-provider/index.tsx

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

2
components/locale/index.tsx

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

Loading…
Cancel
Save