fix: groupsize context error

pull/6348/head
tangjinzhou 2023-03-03 17:13:48 +08:00
parent add208aefb
commit a04cae1221
2 changed files with 10 additions and 8 deletions

View File

@ -1,8 +1,8 @@
import { computed, defineComponent } from 'vue';
import { computed, defineComponent, reactive } from 'vue';
import { flattenChildren } from '../_util/props-util';
import useConfigInject from '../config-provider/hooks/useConfigInject';
import { useToken } from '../theme/internal';
import type { ExtractPropTypes, PropType, ComputedRef } from 'vue';
import type { ExtractPropTypes, PropType } from 'vue';
import type { SizeType } from '../config-provider';
import devWarning from '../vc-util/devWarning';
import createContext from '../_util/createContext';
@ -16,7 +16,7 @@ export const buttonGroupProps = () => ({
export type ButtonGroupProps = Partial<ExtractPropTypes<ReturnType<typeof buttonGroupProps>>>;
export const GroupSizeContext = createContext<{
size: ComputedRef<SizeType>;
size: SizeType;
}>();
export default defineComponent({
compatConfig: { MODE: 3 },
@ -25,9 +25,11 @@ export default defineComponent({
setup(props, { slots }) {
const { prefixCls, direction } = useConfigInject('btn-group', props);
const [, , hashId] = useToken();
GroupSizeContext.useProvide({
size: computed(() => props.size),
});
GroupSizeContext.useProvide(
reactive({
size: computed(() => props.size),
}),
);
const classes = computed(() => {
const { size } = props;
let sizeCls = '';

View File

@ -41,7 +41,7 @@ export default defineComponent({
setup(props, { slots, attrs, emit }) {
const { prefixCls, autoInsertSpaceInButton, direction, size } = useConfigInject('btn', props);
const [wrapSSR, hashId] = useStyle(prefixCls);
const { size: groupSize } = GroupSizeContext.useInject();
const groupSizeContext = GroupSizeContext.useInject();
const buttonNodeRef = ref<HTMLElement>(null);
const delayTimeoutRef = ref(undefined);
let isNeedInserted = false;
@ -81,7 +81,7 @@ export default defineComponent({
const pre = prefixCls.value;
const sizeClassNameMap = { large: 'lg', small: 'sm', middle: undefined };
const sizeFullname = compactSize.value || groupSize?.value || size.value;
const sizeFullname = compactSize.value || groupSizeContext?.size || size.value;
const sizeCls = sizeFullname ? sizeClassNameMap[sizeFullname] || '' : '';
return [