[t-config-provider] vue3.4子组件inject globalConfig不具备响应式

[aolyang]

tdesign-vue-next 版本

1.10.1

重现链接

https://stackblitz.com/edit/angular-fvhxrp-77bkvd?file=package.json

重现步骤

任意 vue3.4以上的版本，用的另一个issue的连接。

期望结果

globalconfig具备响应，子组件国际化能通过globalconfig影响

实际结果

globalConfig无响应

框架版本

Vue3.4

补充说明

<script>
const globalConfig = computed(() => {
    return locale.value === "zh-CN" ? zhCN : enUS
})
</script>
<template>
  <TConfigProvider :globalConfig="globalConfig">
      <TAlert :max-line="2">
          <-- ... !-->
      </TAlert>
  </TConfigProvider>
</template>

devtools查看 config-provider 中的globalConfig是具备响应式的
本地组件手动inject也是可以的，但是 TAlert 中的不会变
最终定位是computed返回的对象保持了引用：

tdesign-vue-next/src/config-provider/useConfig.tsx

Lines 70 to 75 in ada18a1

	const defaultData = cloneDeep(defaultGlobalConfig);
	const mergedGlobalConfig = computed(() =>
	mergeWith(defaultData as unknown as GlobalConfigProvider, props.globalConfig),
	);
	provide(configProviderInjectKey, mergedGlobalConfig);

参考useConfig 本地node_modules手动修改测试可行：

-mergeWith(defaultData as unknown as GlobalConfigProvider, props.globalConfig),
+Object.assign({}, mergeWith(defaultData as unknown as GlobalConfigProvider, props.globalConfig)),

[github-actions]

👋 @aolyang，感谢给 TDesign 提出了 issue。
请根据 issue 模版确保背景信息的完善，我们将调查并尽快回复你。

[aolyang]

相关issue #3854

quick fix: 使用patch功能，修改（es/esm/cjs/lib）的useConfig.mjs 文件，⚠ 注意是否使用了AutoImport插件

var provideConfig = function provideConfig(props) {
  var defaultData = cloneDeep_1(defaultGlobalConfig);
  var mergedGlobalConfig = computed(function () {
-    return mergeWith(defaultData, props.globalConfig);
+    return Object.assign({}, mergeWith(defaultData, props.globalConfig));
  });
  provide(configProviderInjectKey, mergedGlobalConfig);
  if (!globalConfigCopy.value) {
    globalConfigCopy.value = mergedGlobalConfig.value;
  }
  return mergedGlobalConfig;
};

[uyarn]

fixed 1.10.2