docs: sync api

Tencent · Dec 6, 2024 · d5d45da · d5d45da
1 parent ca41d18
commit d5d45da
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 17 deletions.
diff --git a/src/radio/props.ts b/src/radio/props.ts
@@ -70,10 +70,9 @@ export default {
     type: String,
     default: '',
   },
-  /** 复选框和内容相对位置 */
+  /** 复选框和内容相对位置。优先级高于 RadioGroup.placement。Radio 单独存在时，默认值为 left。如果父组件存在 RadioGroup，默认值便由 RadioGroup.placement 决定 */
   placement: {
     type: String as PropType<TdRadioProps['placement']>,
-    default: 'left' as TdRadioProps['placement'],
     validator(val: TdRadioProps['placement']): boolean {
       if (!val) return true;
       return ['left', 'right'].includes(val);

diff --git a/src/radio/radio-group-props.ts b/src/radio/radio-group-props.ts
@@ -35,7 +35,7 @@ export default {
   options: {
     type: Array as PropType<TdRadioGroupProps['options']>,
   },
-  /** 复选框和内容相对位置 */
+  /** 复选框和内容相对位置。优先级低于 Radio.placement */
   placement: {
     type: String as PropType<TdRadioGroupProps['placement']>,
     default: 'left' as TdRadioGroupProps['placement'],
@@ -44,6 +44,11 @@ export default {
       return ['left', 'right'].includes(val);
     },
   },
+  /** 只读状态 */
+  readonly: {
+    type: Boolean,
+    default: undefined,
+  },
   /** 选中的值 */
   value: {
     type: [String, Number, Boolean] as PropType<TdRadioGroupProps['value']>,

diff --git a/src/radio/radio.en-US.md b/src/radio/radio.en-US.md
@@ -20,7 +20,7 @@ label | String / Slot / Function | - | Typescript：`string \| TNode`。[see mor
 maxContentRow | Number | 5 | \- | N
 maxLabelRow | Number | 3 | \- | N
 name | String | - | \- | N
-placement | String | left | options: left/right | N
+placement | String | - | options: left/right | N
 readonly | Boolean | undefined | \- | N
 value | String / Number / Boolean | undefined | Typescript：`T` | N
 onChange | Function |  | Typescript：`(checked: boolean, context: { e: Event }) => void`<br/> | N
@@ -44,6 +44,7 @@ keys | Object | - | Typescript：`KeysType`。[see more ts definition](https://g
 name | String | - | \- | N
 options | Array | - | Typescript：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number \| boolean; disabled?: boolean }`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-vue/blob/develop/src/common.ts)。[see more ts definition](https://github.com/Tencent/tdesign-mobile-vue/tree/develop/src/radio/type.ts) | N
 placement | String | left | options: left/right | N
+readonly | Boolean | undefined | \- | N
 value | String / Number / Boolean | - | `v-model` and `v-model:value` is supported。Typescript：`T` `type RadioValue = string \| number \| boolean`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-vue/tree/develop/src/radio/type.ts) | N
 defaultValue | String / Number / Boolean | - | uncontrolled property。Typescript：`T` `type RadioValue = string \| number \| boolean`。[see more ts definition](https://github.com/Tencent/tdesign-mobile-vue/tree/develop/src/radio/type.ts) | N
 onChange | Function |  | Typescript：`(value: T, context: { e: Event; name?:string }) => void`<br/> | N

diff --git a/src/radio/radio.md b/src/radio/radio.md
@@ -20,7 +20,7 @@ label | String / Slot / Function | - | 主文案。TS 类型：`string \| TNode`
 maxContentRow | Number | 5 | 内容最大行数限制 | N
 maxLabelRow | Number | 3 | 主文案最大行数限制 | N
 name | String | - | HTML 元素原生属性 | N
-placement | String | left | 复选框和内容相对位置。可选项：left/right | N
+placement | String | - | 复选框和内容相对位置。优先级高于 RadioGroup.placement。Radio 单独存在时，默认值为 left。如果父组件存在 RadioGroup，默认值便由 RadioGroup.placement 决定。可选项：left/right | N
 readonly | Boolean | undefined | 只读状态 | N
 value | String / Number / Boolean | undefined | 单选按钮的值。TS 类型：`T` | N
 onChange | Function |  | TS 类型：`(checked: boolean, context: { e: Event }) => void`<br/>选中状态变化时触发 | N
@@ -43,7 +43,8 @@ icon | String / Array | 'circle' | 自定义选中图标和非选中图标。示
 keys | Object | - | 用来定义 value / label 在 `options` 中对应的字段别名。TS 类型：`KeysType`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-vue/blob/develop/src/common.ts) | N
 name | String | - | HTML 元素原生属性 | N
 options | Array | - | 单选组件按钮形式。RadioOption 数据类型为 string 或 number 时，表示 label 和 value 值相同。TS 类型：`Array<RadioOption>` `type RadioOption = string \| number \| RadioOptionObj` `interface RadioOptionObj { label?: string \| TNode; value?: string \| number \| boolean; disabled?: boolean }`。[通用类型定义](https://github.com/Tencent/tdesign-mobile-vue/blob/develop/src/common.ts)。[详细类型定义](https://github.com/Tencent/tdesign-mobile-vue/tree/develop/src/radio/type.ts) | N
-placement | String | left | 复选框和内容相对位置。可选项：left/right | N
+placement | String | left | 复选框和内容相对位置。优先级低于 Radio.placement。可选项：left/right | N
+readonly | Boolean | undefined | 只读状态 | N
 value | String / Number / Boolean | - | 选中的值。支持语法糖 `v-model` 或 `v-model:value`。TS 类型：`T` `type RadioValue = string \| number \| boolean`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-vue/tree/develop/src/radio/type.ts) | N
 defaultValue | String / Number / Boolean | - | 选中的值。非受控属性。TS 类型：`T` `type RadioValue = string \| number \| boolean`。[详细类型定义](https://github.com/Tencent/tdesign-mobile-vue/tree/develop/src/radio/type.ts) | N
 onChange | Function |  | TS 类型：`(value: T, context: { e: Event; name?:string }) => void`<br/>选中值发生变化时触发, `context.name` 指 RadioGroup 的 name 属性 | N

diff --git a/src/radio/radio.tsx b/src/radio/radio.tsx
@@ -1,4 +1,4 @@
-import { inject, computed, defineComponent, Ref, getCurrentInstance } from 'vue';
+import { inject, computed, defineComponent, Ref } from 'vue';
 import { CheckIcon, CheckCircleFilledIcon } from 'tdesign-icons-vue-next';
 import { useDefault } from '../shared';
 import config from '../config';
@@ -18,7 +18,6 @@ export default defineComponent({
     const renderTNodeContent = useContent();
     const renderTNodeJSX = useTNodeJSX();
     const radioClass = usePrefixClass('radio');
-    const { vnode } = getCurrentInstance();
 
     const [innerChecked, setInnerChecked] = useDefault<boolean, TdRadioProps>(props, context.emit, 'checked', 'change');
 
@@ -37,12 +36,8 @@ export default defineComponent({
       return props.borderless;
     });
     const finalPlacement = computed(() => {
-      const vProps = vnode.props || {};
-      if (Reflect.has(vProps, 'placement')) return props.placement;
-
-      if ('placement' in rootGroupProps) return rootGroupProps.placement;
-
-      return props.placement || 'left';
+      if (props.placement == null && 'placement' in rootGroupProps) return rootGroupProps.placement;
+      return props.placement;
     });
 
     const finalAllowUncheck = computed(() => Boolean(props.allowUncheck || rootGroupProps?.allowUncheck));

diff --git a/src/radio/type.ts b/src/radio/type.ts
@@ -77,8 +77,7 @@ export interface TdRadioProps<T = RadioValue> {
    */
   name?: string;
   /**
-   * 复选框和内容相对位置
-   * @default left
+   * 复选框和内容相对位置。优先级高于 RadioGroup.placement。Radio 单独存在时，默认值为 left。如果父组件存在 RadioGroup，默认值便由 RadioGroup.placement 决定
    */
   placement?: 'left' | 'right';
   /**
@@ -129,10 +128,14 @@ export interface TdRadioGroupProps<T = RadioValue> {
    */
   options?: Array<RadioOption>;
   /**
-   * 复选框和内容相对位置
+   * 复选框和内容相对位置。优先级低于 Radio.placement
    * @default left
    */
   placement?: 'left' | 'right';
+  /**
+   * 只读状态
+   */
+  readonly?: boolean;
   /**
    * 选中的值
    */