fix(Link): disabled priority

Tencent · Jul 16, 2024 · c20293a · c20293a
1 parent fce4f2c
commit c20293a
Show file tree

Hide file tree

Showing 5 changed files with 15 additions and 11 deletions.
diff --git a/src/link/link.en-US.md b/src/link/link.en-US.md
@@ -8,7 +8,7 @@ name | type | default | description | required
 -- | -- | -- | -- | --
 content | String / Slot / Function | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-vue/blob/develop/src/common.ts) | N
 default | String / Slot / Function | - | Typescript：`string \| TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-vue/blob/develop/src/common.ts) | N
-disabled | Boolean | - | make link to be disabled | N
+disabled | Boolean | undefined | make link to be disabled | N
 hover | Boolean | - | \- | N
 href | String | - | \- | N
 prefixIcon | Slot / Function | - | Typescript：`TNode`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-vue/blob/develop/src/common.ts) | N

diff --git a/src/link/link.md b/src/link/link.md
@@ -8,7 +8,7 @@
 -- | -- | -- | -- | --
 content | String / Slot / Function | - | 链接内容。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-vue/blob/develop/src/common.ts) | N
 default | String / Slot / Function | - | 链接内容，同 content。TS 类型：`string \| TNode`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-vue/blob/develop/src/common.ts) | N
-disabled | Boolean | - | 禁用链接 | N
+disabled | Boolean | undefined | 禁用链接。优先级：Link.disabled > Form.disabled | N
 hover | Boolean | - | 是否开启点击反馈 | N
 href | String | - | 跳转链接 | N
 prefixIcon | Slot / Function | - | 前置图标。TS 类型：`TNode`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-vue/blob/develop/src/common.ts) | N

diff --git a/src/link/link.tsx b/src/link/link.tsx
@@ -1,18 +1,19 @@
 import { defineComponent, computed } from 'vue';
 import config from '../config';
-import LinkProps from './props';
+import props from './props';
 import { useContent, useTNodeJSX } from '../hooks/tnode';
 import { usePrefixClass } from '../hooks/useClass';
+import { useFormDisabled } from '../form/hooks';
 
 const { prefix } = config;
-const name = `${prefix}-link`;
 export default defineComponent({
-  name,
-  props: LinkProps,
+  name: `${prefix}-link`,
+  props,
   setup(props) {
     const linkClass = usePrefixClass('link');
     const renderTNodeJSX = useTNodeJSX();
     const renderTNodeContent = useContent();
+    const isDisabled = useFormDisabled();
 
     const linkClasses = computed(() => [
       linkClass.value,
@@ -49,9 +50,9 @@ export default defineComponent({
       return (
         <a
           class={linkClasses.value}
-          aria-disabled={props.disabled}
+          aria-disabled={isDisabled.value}
           target={props.target}
-          href={props.disabled || !props.href ? undefined : props.href}
+          href={isDisabled.value || !props.href ? undefined : props.href}
           onClick={handleClick}
         >
           {renderPrefixIcon()}

diff --git a/src/link/props.ts b/src/link/props.ts
@@ -16,8 +16,11 @@ export default {
   default: {
     type: [String, Function] as PropType<TdLinkProps['default']>,
   },
-  /** 禁用链接 */
-  disabled: Boolean,
+  /** 禁用链接。优先级：Link.disabled > Form.disabled */
+  disabled: {
+    type: Boolean,
+    default: undefined,
+  },
   /** 是否开启点击反馈 */
   hover: Boolean,
   /** 跳转链接 */

diff --git a/src/link/type.ts b/src/link/type.ts
@@ -16,7 +16,7 @@ export interface TdLinkProps {
    */
   default?: string | TNode;
   /**
-   * 禁用链接
+   * 禁用链接。优先级：Link.disabled > Form.disabled
    */
   disabled?: boolean;
   /**