From 0dc3935b9f12e99ff48a8a20d0cd7502cad5fab0 Mon Sep 17 00:00:00 2001 From: brianfzhang Date: Mon, 4 Jul 2022 19:20:58 +0800 Subject: [PATCH 1/3] =?UTF-8?q?fix:=20=E6=9B=B4=E6=94=B9=20useConfig=20com?= =?UTF-8?q?puted=E5=B1=9E=E6=80=A7=E8=AE=A1=E7=AE=97=E5=AF=BC=E8=87=B4?= =?UTF-8?q?=E5=88=97=E8=A1=A8=E6=B8=B2=E6=9F=93=E5=8D=A1=E9=A1=BF=E9=97=AE?= =?UTF-8?q?=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/config-provider/useConfig.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/config-provider/useConfig.tsx b/src/config-provider/useConfig.tsx index 2d9cae6e3..5a1cc191f 100644 --- a/src/config-provider/useConfig.tsx +++ b/src/config-provider/useConfig.tsx @@ -11,7 +11,6 @@ export function useConfig(componentName?: const injectGlobalConfig = inject('globalConfig', null); const mergedGlobalConfig = computed(() => injectGlobalConfig || defaultGlobalConfig); const global = computed(() => mergedGlobalConfig.value[componentName]); - const classPrefix = computed(() => mergedGlobalConfig.value.classPrefix); // 处理正则表达式 @@ -42,7 +41,6 @@ export function useConfig(componentName?: classPrefix, }; } - export function usePrefixClass(componentName?: string) { const { classPrefix } = useConfig('classPrefix'); return computed(() => (componentName ? `${classPrefix.value}-${componentName}` : classPrefix.value)); From ef369337efc18f0e0e01c1fb0d419047d0c74360 Mon Sep 17 00:00:00 2001 From: brianfzhang Date: Mon, 4 Jul 2022 19:37:26 +0800 Subject: [PATCH 2/3] =?UTF-8?q?fix:=20=E6=9B=B4=E6=94=B9=20useConfig=20com?= =?UTF-8?q?puted=E5=B1=9E=E6=80=A7=E8=AE=A1=E7=AE=97=E5=AF=BC=E8=87=B4?= =?UTF-8?q?=E5=88=97=E8=A1=A8=E6=B8=B2=E6=9F=93=E5=8D=A1=E9=A1=BF=E9=97=AE?= =?UTF-8?q?=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/config-provider/useConfig.tsx | 58 ++++++++++++++++++------------- 1 file changed, 33 insertions(+), 25 deletions(-) diff --git a/src/config-provider/useConfig.tsx b/src/config-provider/useConfig.tsx index 5a1cc191f..f69f22486 100644 --- a/src/config-provider/useConfig.tsx +++ b/src/config-provider/useConfig.tsx @@ -1,6 +1,28 @@ -import { computed, inject, h } from '@vue/composition-api'; +import { inject, h } from '@vue/composition-api'; import { GlobalConfigProvider, defaultGlobalConfig } from './context'; +// 处理正则表达式 +const t = function (pattern: T, ...args: any[]) { + const [data] = args; + if (typeof pattern === 'string') { + if (!data) return pattern; + const regular = /\{\s*([\w-]+)\s*\}/g; + const translated = pattern.replace(regular, (match, key) => { + if (data) { + return String(data[key]); + } + return ''; + }); + return translated; + } + if (typeof pattern === 'function') { + // 重要：组件的渲染必须存在参数 h，不能移除 + if (!args.length) return pattern(h); + return pattern(...args); + } + return ''; +}; + /** * component global config * @param componentName @@ -9,30 +31,13 @@ import { GlobalConfigProvider, defaultGlobalConfig } from './context'; */ export function useConfig(componentName?: T) { const injectGlobalConfig = inject('globalConfig', null); - const mergedGlobalConfig = computed(() => injectGlobalConfig || defaultGlobalConfig); - const global = computed(() => mergedGlobalConfig.value[componentName]); - const classPrefix = computed(() => mergedGlobalConfig.value.classPrefix); + const mergedGlobalConfig = injectGlobalConfig || defaultGlobalConfig; + const global = { + value: mergedGlobalConfig[componentName], + }; - // 处理正则表达式 - const t = function (pattern: T, ...args: any[]) { - const [data] = args; - if (typeof pattern === 'string') { - if (!data) return pattern; - const regular = /\{\s*([\w-]+)\s*\}/g; - const translated = pattern.replace(regular, (match, key) => { - if (data) { - return String(data[key]); - } - return ''; - }); - return translated; - } - if (typeof pattern === 'function') { - // 重要：组件的渲染必须存在参数 h，不能移除 - if (!args.length) return pattern(h); - return pattern(...args); - } - return ''; + const classPrefix = { + value: mergedGlobalConfig.classPrefix, }; return { @@ -41,7 +46,10 @@ export function useConfig(componentName?: classPrefix, }; } + export function usePrefixClass(componentName?: string) { const { classPrefix } = useConfig('classPrefix'); - return computed(() => (componentName ? `${classPrefix.value}-${componentName}` : classPrefix.value)); + return { + value: componentName ? `${classPrefix.value}-${componentName}` : classPrefix.value, + }; } From 7f843826e3df269f55baf522b29dad8b338560db Mon Sep 17 00:00:00 2001 From: brianfzhang Date: Mon, 4 Jul 2022 20:06:14 +0800 Subject: [PATCH 3/3] =?UTF-8?q?fix:=20fix:=E6=9B=B4=E6=94=B9=E5=8F=98?= =?UTF-8?q?=E9=87=8F=E7=94=B3=E6=98=8E=E4=BD=BF=E7=94=A8ref=E5=AE=9E?= =?UTF-8?q?=E7=8E=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/config-provider/useConfig.tsx | 14 ++++---------- 1 file changed, 4 insertions(+), 10 deletions(-) diff --git a/src/config-provider/useConfig.tsx b/src/config-provider/useConfig.tsx index f69f22486..a861aa797 100644 --- a/src/config-provider/useConfig.tsx +++ b/src/config-provider/useConfig.tsx @@ -1,4 +1,4 @@ -import { inject, h } from '@vue/composition-api'; +import { inject, h, ref } from '@vue/composition-api'; import { GlobalConfigProvider, defaultGlobalConfig } from './context'; // 处理正则表达式 @@ -32,13 +32,9 @@ const t = function (pattern: T, ...args: any[]) { export function useConfig(componentName?: T) { const injectGlobalConfig = inject('globalConfig', null); const mergedGlobalConfig = injectGlobalConfig || defaultGlobalConfig; - const global = { - value: mergedGlobalConfig[componentName], - }; - const classPrefix = { - value: mergedGlobalConfig.classPrefix, - }; + const global = ref(mergedGlobalConfig[componentName]); + const classPrefix = ref(mergedGlobalConfig.classPrefix); return { t, @@ -49,7 +45,5 @@ export function useConfig(componentName?: export function usePrefixClass(componentName?: string) { const { classPrefix } = useConfig('classPrefix'); - return { - value: componentName ? `${classPrefix.value}-${componentName}` : classPrefix.value, - }; + return ref(componentName ? `${classPrefix.value}-${componentName}` : classPrefix.value); }