-
+
-
-
+
@@ -347,10 +347,10 @@ exports[`renders ./components/button/demo/multiple.vue correctly 1`] = `
secondary
-
diff --git a/components/button/button.tsx b/components/button/button.tsx
index 06a30f118..32fdf9e21 100644
--- a/components/button/button.tsx
+++ b/components/button/button.tsx
@@ -13,6 +13,7 @@ import Wave from '../_util/wave';
import buttonProps from './buttonTypes';
import { flattenChildren, initDefaultProps } from '../_util/props-util';
import useConfigInject from '../config-provider/hooks/useConfigInject';
+import { useInjectDisabled } from '../config-provider/DisabledContext';
import devWarning from '../vc-util/devWarning';
import LoadingIcon from './LoadingIcon';
import useStyle from './style';
@@ -46,6 +47,8 @@ export default defineComponent({
const { prefixCls, autoInsertSpaceInButton, direction, size } = useConfigInject('btn', props);
const [wrapSSR, hashId] = useStyle(prefixCls);
const groupSizeContext = GroupSizeContext.useInject();
+ const disabledContext = useInjectDisabled();
+ const mergedDisabled = computed(() => props.disabled ?? disabledContext.value);
const buttonNodeRef = shallowRef
(null);
const delayTimeoutRef = shallowRef(undefined);
let isNeedInserted = false;
@@ -124,7 +127,7 @@ export default defineComponent({
};
const handleClick = (event: Event) => {
// https://github.com/ant-design/ant-design/issues/30207
- if (innerLoading.value || props.disabled) {
+ if (innerLoading.value || mergedDisabled.value) {
event.preventDefault();
return;
}
@@ -178,13 +181,13 @@ export default defineComponent({
isNeedInserted = children.length === 1 && !icon && !isUnBorderedButtonType(props.type);
- const { type, htmlType, disabled, href, title, target } = props;
+ const { type, htmlType, href, title, target } = props;
const iconType = innerLoading.value ? 'loading' : icon;
const buttonProps = {
...attrs,
title,
- disabled,
+ disabled: mergedDisabled.value,
class: [
classes.value,
attrs.class,
@@ -194,7 +197,7 @@ export default defineComponent({
onMousedown: handleMousedown,
};
// https://github.com/vueComponent/ant-design-vue/issues/4930
- if (!disabled) {
+ if (!mergedDisabled.value) {
delete buttonProps.disabled;
}
const iconNode =
diff --git a/components/checkbox/Checkbox.tsx b/components/checkbox/Checkbox.tsx
index 145d9f273..a52109a5c 100644
--- a/components/checkbox/Checkbox.tsx
+++ b/components/checkbox/Checkbox.tsx
@@ -33,7 +33,6 @@ export default defineComponent({
const formItemContext = useInjectFormItemContext();
const formItemInputContext = FormItemInputContext.useInject();
const { prefixCls, direction, disabled } = useConfigInject('checkbox', props);
-
// style
const [wrapSSR, hashId] = useStyle(prefixCls);
@@ -85,6 +84,7 @@ export default defineComponent({
id,
prefixCls: prefixCls.value,
...restAttrs,
+ disabled: mergedDisabled.value,
};
if (checkboxGroup && !skipGroup) {
checkboxProps.onChange = (...args) => {
@@ -93,7 +93,7 @@ export default defineComponent({
};
checkboxProps.name = checkboxGroup.name.value;
checkboxProps.checked = checkboxGroup.mergedValue.value.includes(props.value);
- checkboxProps.disabled = props.disabled || checkboxGroup.disabled.value;
+ checkboxProps.disabled = mergedDisabled.value || checkboxGroup.disabled.value;
checkboxProps.indeterminate = indeterminate;
} else {
checkboxProps.onChange = handleChange;
diff --git a/components/form/__tests__/__snapshots__/demo.test.js.snap b/components/form/__tests__/__snapshots__/demo.test.js.snap
index 7972ca268..3a4f51c88 100644
--- a/components/form/__tests__/__snapshots__/demo.test.js.snap
+++ b/components/form/__tests__/__snapshots__/demo.test.js.snap
@@ -294,7 +294,7 @@ exports[`renders ./components/form/demo/custom-validation.vue correctly 1`] = `
@@ -333,9 +333,10 @@ exports[`renders ./components/form/demo/customized-form-controls.vue correctly 1