@tdesign/uniapp 0.7.3 → 0.8.1

package/CHANGELOG.md

@@ -5,6 +5,40 @@ toc: false
 docClass: timeline
 ---
 
+## 🌈 0.8.1 `2026-04-09`
+
+### 🚀 Features
+
+- `Icon`: 新增 `divider-1`, `voice-wave` 和 `keyboard-1`  图标 @uyarn ([#4395](https://github.com/Tencent/tdesign-miniprogram/pull/4395))
+
+### 🐞 Bug Fixes
+
+- `Form`: 修复 `FormItem` 右侧箭头深色模式颜色错误 @anlyyao ([#4384](https://github.com/Tencent/tdesign-miniprogram/pull/4384))
+- `Rate`: 修复提示框层级不够被覆盖的问题 @liweijie0812 ([#4386](https://github.com/Tencent/tdesign-miniprogram/pull/4386))
+
+## 🌈 0.8.0 `2026-03-23`
+
+### 🚨 Breaking Changes
+
+- `DateTimePicker`: 废弃 `custom-locale` 属性，请用 `ConfigProvider` 替换该功能 @novlan1 ([#4350](https://github.com/Tencent/tdesign-miniprogram/pull/4350))
+
+### 🚀 Features
+
+- `Cascader`: 新增 `PopupProps` 属性，透传至 `Popup` @novlan1 ([#4320](https://github.com/Tencent/tdesign-miniprogram/pull/4320))
+- `ConfigProvider`: 新增 `ConfigProvider` 全局特性配置组件 @novlan1 ([#4350](https://github.com/Tencent/tdesign-miniprogram/pull/4350))
+- `Picker`: 支持 `v-model:value` 语法糖 @novlan1 ([#4320](https://github.com/Tencent/tdesign-miniprogram/pull/4320))
+
+### 🐞 Bug Fixes
+
+- `ColorPicker`: 修复弹窗模式下预设颜色（swatch-colors）无法横向滚动 @novlan1 ([#4350](https://github.com/Tencent/tdesign-miniprogram/pull/4350))
+- `DateTimePicker`: 修复 `format` 含非日期 `token`（如 `ddd`）时，格式化后的值回传导致 `Invalid Date` 的问题 @novlan1 ([#4320](https://github.com/Tencent/tdesign-miniprogram/pull/4320))
+- `Form`: 修复 `required-mark` 无效问题 @novlan1 ([#4350](https://github.com/Tencent/tdesign-miniprogram/pull/4350))
+- `Tabs`: 修复开启 `animation` 和 `lazy` 时，跳跃切换选项卡内容区域显示异常的问题 @novlan1 ([#4350](https://github.com/Tencent/tdesign-miniprogram/pull/4350))
+- `Toast`: 修复 `setup` 语法下，函数式调用时找不到实例的问题 @novlan1 ([#4312](https://github.com/Tencent/tdesign-miniprogram/pull/4312))
+- `Upload`: 
+  - 修复 `@upload-disabled-mask` 变量默认值错误 @anlyyao ([#4303](https://github.com/Tencent/tdesign-miniprogram/pull/4303))
+  - 修复 H5 环境下回调中 URL 错误问题 @novlan1 ([#4320](https://github.com/Tencent/tdesign-miniprogram/pull/4320))
+
 ## 🌈 0.7.3 `2026-03-04`
 
 ### 🐞 Bug Fixes

package/README.md

@@ -51,47 +51,37 @@ npm i @tdesign/uniapp
 
 ## 使用
 
-1. 在 `main.ts` 中引入样式文件
+### 步骤一：引入样式文件
 
-```js
-// CLI 模式
-import '@tdesign/uniapp/common/style/theme/index.css';
-
-// HBuilderX 模式
-// import './uni_modules/tdesign-uniapp/components/common/style/theme/index.css';
-```
+在 `main.ts` 中引入组件库样式：
 
-也可以引入 `rpx` 单位的 `less` 文件，该文件与 `tdesign-miniprogram` 完全一致。
+#### CLI 模式
 
 ```js
-// CLI 模式
-import '@tdesign/uniapp/common/style/theme/index.less';
+// Less（推荐，rpx 单位，与 tdesign-miniprogram 完全一致）
+import '@tdesign/uniapp/theme.less';
 
-// HBuilderX 模式
-// import './uni_modules/tdesign-uniapp/components/common/style/theme/index.less';
+// 或者引入编译后的 CSS 文件
+import '@tdesign/uniapp/theme.css';
 ```
 
-2. 在文件中使用
+#### HBuilderX 模式
 
-```html
-<template>
-  <t-loading />
-</template>
+```js
+// Less（推荐，rpx 单位，与 tdesign-miniprogram 完全一致）
+import './uni_modules/tdesign-uniapp/components/theme.less';
 
-<script lang="ts" setup>
-import TLoading from '@tdesign/uniapp/loading/loading.vue';
-</script>
+// 或者引入编译后的 CSS 文件
+import './uni_modules/tdesign-uniapp/components/theme.css';
 ```
 
-只提供按需导入方式，不支持全量导入（全量导入在小程序下有兼容性问题）。
+### 步骤二：注册组件
 
-## 自动导入
+#### 自动导入（推荐）
 
-在 `pages.json` 配置 [easycom](https://uniapp.dcloud.net.cn/collocation/pages.html#easycom)，可实现自动导入。
+配置 [easycom](https://uniapp.dcloud.net.cn/collocation/pages.html#easycom) 后，无需手动引入组件即可直接在模板中使用，在 `pages.json` 中添加以下配置：
 
-### CLI 模式
-
-使用 CLI 模式，即使用 `node_modules` 下的 `@tdesign/uniapp` 时，配置如下。
+**CLI 模式**：使用 `node_modules` 下的 `@tdesign/uniapp` 时，配置如下。
 
 ```json
 {
@@ -103,9 +93,7 @@ import TLoading from '@tdesign/uniapp/loading/loading.vue';
 }
 ```
 
-### UNI_MODULES 模式
-
-使用 `uni_modules` 下的 `tdesign-uniapp` 时，配置如下。
+**HBuilderX 模式**：使用 `uni_modules` 下的 `tdesign-uniapp` 时，配置如下。
 
 ```json
 {
@@ -117,11 +105,33 @@ import TLoading from '@tdesign/uniapp/loading/loading.vue';
 }
 ```
 
-## 编辑器提示
+配置完成后，可以直接在模板中使用组件：
 
-安装注册 TDesign 之后，在开发项目时，可以配合插件在VSCode等主流编辑器中达到提示组件名及API的效果。
+```html
+<template>
+  <t-loading />
+</template>
+```
+
+#### 手动导入
+
+如果不使用 easycom，也可以在 `<script>` 中手动导入组件：
+
+```html
+<template>
+  <t-loading />
+</template>
 
-推荐安装 [Vue (Official)](https://marketplace.visualstudio.com/items?itemName=Vue.volar) 插件，并在项目的 `tsconfig.json` 的 `compilerOptions.types` 属性中增加 `@tdesign/uniapp/global`，即可实现提示效果。
+<script lang="ts" setup>
+import TLoading from '@tdesign/uniapp/loading/loading.vue';
+</script>
+```
+
+> 只提供按需导入方式，不支持全量导入（全量导入在小程序下有兼容性问题）。
+
+### 步骤三：配置编辑器提示（可选）
+
+推荐安装 [Vue (Official)](https://marketplace.visualstudio.com/items?itemName=Vue.volar) 插件，并在项目的 `tsconfig.json` 的 `compilerOptions.types` 属性中增加 `@tdesign/uniapp/global`，即可在 VSCode 等主流编辑器中获得组件名及 API 的智能提示。
 
 ```json
 {
@@ -145,7 +155,7 @@ import TLoading from '@tdesign/uniapp/loading/loading.vue';
 
 ## 浏览器兼容性
 
-| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari-ios/safari-ios_48x48.png" alt="iOS Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/> iOS Safari| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/samsung-internet/samsung-internet_48x48.png" alt="Samsung" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Samsung | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Opera |[<img src="https://user-images.githubusercontent.com/51158141/189169679-71e045f6-9b9b-4baf-8b9f-e045a40216f5.png" alt="Android Browser" width="24px" height="24px" />]()<br/>Android Browser|
+| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari-ios/safari-ios_48x48.png" alt="iOS Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/> iOS Safari| [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/samsung-internet/samsung-internet_48x48.png" alt="Samsung" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Samsung | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png" alt="Opera" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br/>Opera |<img src="https://user-images.githubusercontent.com/51158141/189169679-71e045f6-9b9b-4baf-8b9f-e045a40216f5.png" alt="Android Browser" width="24px" height="24px" /><br/>Android Browser|
 | --------- | --------- | --------- | --------- | --------- |--------- |
 | Firefox >=104| Chrome >=105| iOS Safari >=12.2| Samsung >=10.2 | Opera >=64 | Android Browser >=105 |
 
@@ -162,7 +172,6 @@ import TLoading from '@tdesign/uniapp/loading/loading.vue';
 | [TDesign UniApp Starter Vue3 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue3-hx/) | Vue3 + HBuilderX 模式模板 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue3-hx-h5.png" height="100" /> |
 | [TDesign UniApp Starter Vue2 CLI](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-cli/) | Vue2 + CLI 模式模板 | <img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-cli-h5.png" height="100" /> |
 | [TDesign UniApp Starter Vue2 HX](https://github.com/TDesignOteam/tdesign-uniapp-starter-vue2-hx/) | Vue2 + HBuilderX 模式模板 |<img src="https://cdn.uwayfly.com/tdesign-uniapp/image/tdesign-uniapp-starter-vue2-hx-h5.png" height="100" /> |
-
 ## 反馈
 
 有任何问题，建议通过 [Github issues](https://github.com/Tencent/tdesign-miniprogram/issues) 反馈或扫码加入用户微信群。

package/dist/action-sheet/README.md

@@ -1,14 +1,16 @@
 ---
 title: ActionSheet 动作面板
 description: 由用户操作后触发的一种特定的模态弹出框 ，呈现一组与当前情境相关的两个或多个选项。
-spline: data
+spline: message
 isComponent: true
 ---
 
 
 ## 引入
 
-可在 `main.ts` 或在需要使用的页面或组件中引入。
+推荐使用 easycom 模式引入组件，配置后无需手动 import 即可直接在模板中使用 `<t-action-sheet />`。详细配置请参考 [快速开始](../getting-started)。
+
+如需手动引入：
 
 ```js
 import TActionSheet from '@tdesign/uniapp/action-sheet/action-sheet.vue';
@@ -40,7 +42,10 @@ import TActionSheet from '@tdesign/uniapp/action-sheet/action-sheet.vue';
 ### 支持指令调用
 
 ```javascript
-import ActionSheet, { ActionSheetTheme } from '@tdesign/uniapp/action-sheet/index';
+// ActionSheetPlugin 和 ActionSheet 均可使用
+import { ActionSheetPlugin, ActionSheetTheme } from '@tdesign/uniapp';
+// 或
+// import { ActionSheet, ActionSheetTheme } from '@tdesign/uniapp';
 
 // 指令调用不同于组件引用不需要传入visible
 const basicListOption: ActionSheetShowOption = {
@@ -61,7 +66,7 @@ const basicListOption: ActionSheetShowOption = {
   ],
 };
 
-const handler = ActionSheet.show(basicListOption);
+const handler = ActionSheetPlugin.show(basicListOption);
 ```
 
 指令调用的关闭如下

package/dist/action-sheet/action-sheet.vue

@@ -1,8 +1,8 @@
 <template>
   <view
     :id="classPrefix"
-    :style="tools._style([rootCustomStyle])"
-    :class="tools.cls(classPrefix, [dataAlign, dataTheme, ['no-description', !description]]) + ' ' + tClass"
+    :style="'' + tools._style([rootCustomStyle])"
+    :class="'' + tools.cls(classPrefix, [dataAlign, dataTheme, ['no-description', !description]]) + ' ' + tClass"
   >
     <t-popup
       :visible="dataVisible"
@@ -44,7 +44,7 @@
                 :description="item.description || ''"
                 :image="item.image || ''"
                 :style="'--td-grid-item-text-color: ' + item.color"
-                @click="onSelect($event, { index })"
+                @click="(e) => onSelect(e, { index })"
               />
             </t-grid>
           </block>
@@ -78,7 +78,7 @@
                       :description="item.description || ''"
                       :image="item.image || ''"
                       :style="'--td-grid-item-text-color: ' + item.color"
-                      @click="onSelect($event, { index })"
+                      @click="(e) => onSelect(e, { index })"
                     />
                   </t-grid>
                 </swiper-item>
@@ -107,7 +107,7 @@
             <view
               :data-index="index"
               :style="item.color ? 'color: ' + item.color : ''"
-              :class="tools.cls(classPrefix + '__list-item', [['disabled', item.disabled]])"
+              :class="'' + tools.cls(classPrefix + '__list-item', [['disabled', item.disabled]])"
               :aria-role="ariaRole || 'button'"
               :aria-label="item.label || item"
               tabindex="0"
@@ -166,7 +166,7 @@
           aria-role="button"
           @click="onCancel"
         >
-          {{ dataCancelText || '取消' }}
+          {{ dataCancelText || globalConfig.cancel }}
         </view>
       </view>
     </t-popup>
@@ -185,181 +185,189 @@ import props from './props';
 import useCustomNavbar from '../mixins/using-custom-navbar';
 import tools from '../common/utils.wxs';
 import { getFunctionalMixin } from '../common/functional/mixin';
+import usingConfig from '../mixins/using-config';
 import { getIconData } from './computed';
 
-const name = `${prefix}-action-sheet`;
+const componentName = 'action-sheet';
+const name = `${prefix}-${componentName}`;
 
 
-export default uniComponent({
-  name,
-  options: {
-    styleIsolation: 'shared',
-  },
-  controlledProps: [{
-    key: 'visible',
-    event: 'visible-change',
-  }],
-  externalClasses: [
-    `${prefix}-class`,
-    `${prefix}-class-content`,
-    `${prefix}-class-cancel`,
-  ],
-  mixins: [getFunctionalMixin(props), useCustomNavbar],
+export default {
   components: {
     TIcon,
     TPopup,
     TGrid,
     TGridItem,
   },
-  props: {
-    ...props,
-  },
-  emits: [
-    'visible-change',
-    'update:visible',
-  ],
-  data() {
-    return {
-      prefix,
-      classPrefix: name,
-      gridThemeItems: [],
-      currentSwiperIndex: 0,
-      defaultOverlayProps: {},
-      defaultPopUpzIndex: 11500,
-      tools,
-
-      heightStyle: 'height: 456rpx;',
-    };
-  },
-  computed: {
-    rootCustomStyle() {
-      return tools._style([
-        this.customStyle,
-        this.dataTheme === 'grid' ? 'padding-bottom: 16rpx' : '',
-      ]);
-    },
-    iconCustomStyle() {
-      return 'margin-right: 8px;';
+  ...uniComponent({
+    name,
+    options: {
+      styleIsolation: 'shared',
     },
-    suffixIconCustomStyle() {
-      return 'margin-right: 8px;margin-left: auto;';
+    controlledProps: [{
+      key: 'visible',
+      event: 'visible-change',
+    }],
+    externalClasses: [
+      `${prefix}-class`,
+      `${prefix}-class-content`,
+      `${prefix}-class-cancel`,
+    ],
+    mixins: [
+      getFunctionalMixin(props),
+      useCustomNavbar,
+      usingConfig({ componentName }),
+    ],
+    props: {
+      ...props,
     },
-    gridStyle() {
-      return `${this.heightStyle}padding-bottom: 48rpx;`;
+    emits: [
+      'visible-change',
+      'update:visible',
+    ],
+    data() {
+      return {
+        prefix,
+        classPrefix: name,
+        gridThemeItems: [],
+        currentSwiperIndex: 0,
+        defaultOverlayProps: {},
+        defaultPopUpzIndex: 11500,
+        tools,
+
+        heightStyle: 'height: 456rpx;',
+      };
     },
-  },
-  watch: {
-    dataVisible: {
-      handler(e) {
-        if (e) {
-          this.init();
-        }
+    computed: {
+      rootCustomStyle() {
+        return tools._style([
+          this.customStyle,
+          this.dataTheme === 'grid' ? 'padding-bottom: 16rpx' : '',
+        ]);
       },
-      immediate: true,
-    },
-    dataItems: {
-      handler() {
-        if (this.dataVisible) {
-          this.init();
-        }
+      iconCustomStyle() {
+        return 'margin-right: 8px;';
+      },
+      suffixIconCustomStyle() {
+        return 'margin-right: 8px;margin-left: auto;';
+      },
+      gridStyle() {
+        return `${this.heightStyle}padding-bottom: 48rpx;`;
       },
-      immediate: true,
     },
-  },
-  methods: {
-    init() {
-      this.memoInitialData();
-      this.splitGridThemeActions();
+    watch: {
+      dataVisible: {
+        handler(e) {
+          if (e) {
+            this.init();
+          }
+        },
+        immediate: true,
+      },
+      dataItems: {
+        handler() {
+          if (this.dataVisible) {
+            this.init();
+          }
+        },
+        immediate: true,
+      },
     },
+    methods: {
+      init() {
+        this.memoInitialData();
+        this.splitGridThemeActions();
+      },
 
-    getIconData,
+      getIconData,
 
-    memoInitialData() {
-      this.initialData = {
-      };
-    },
-
-    splitGridThemeActions() {
-      if (this.dataTheme !== actionSheetTheme.Grid) return;
-      this.gridThemeItems = chunk(this.dataItems, this.dataCount);
-    },
+      memoInitialData() {
+        this.initialData = {
+        };
+      },
 
-    /** 指令调用显示 */
-    show(options) {
-      const defaultOptions = [
-        'align',
-        'cancelText',
-        'count',
-        'description',
-        'items',
-        'popupProps',
-        'showCancel',
-        'showOverlay',
-        'theme',
-        'usingCustomNavbar',
-      ].reduce((acc, key) => ({
-        ...acc,
-        [key]: props[key].default,
-      }));
+      splitGridThemeActions() {
+        if (this.dataTheme !== actionSheetTheme.Grid) return;
+        this.gridThemeItems = chunk(this.dataItems, this.dataCount);
+      },
 
-      this.setData({
-        ...defaultOptions,
-        ...options,
-        visible: true,
-      });
-      this.splitGridThemeActions();
-      this.autoClose = true;
-      this._trigger('visible-change', { visible: true });
-    },
+      /** 指令调用显示 */
+      show(options) {
+        const defaultOptions = [
+          'align',
+          'cancelText',
+          'count',
+          'description',
+          'items',
+          'popupProps',
+          'showCancel',
+          'showOverlay',
+          'theme',
+          'usingCustomNavbar',
+        ].reduce((acc, key) => ({
+          ...acc,
+          [key]: props[key].default,
+        }));
 
-    /** 指令调用隐藏 */
-    close() {
-      this.$emit('close', { trigger: 'command' });
-      this._trigger('visible-change', { visible: false });
-    },
+        this.setData({
+          ...defaultOptions,
+          ...options,
+          visible: true,
+        });
+        this.splitGridThemeActions();
+        this.autoClose = true;
+        this._trigger('visible-change', { visible: true });
+      },
 
-    /** 默认点击遮罩关闭 */
-    onPopupVisibleChange(detail) {
-      if (!detail.visible) {
-        this.$emit('close', { trigger: 'overlay' });
+      /** 指令调用隐藏 */
+      close() {
+        this.$emit('close', { trigger: 'command' });
         this._trigger('visible-change', { visible: false });
-      }
-      if (this.autoClose) {
-        this.dataVisible = false;
-        this.autoClose = false;
-      }
-    },
+      },
 
-    onSwiperChange(e) {
-      const { current } = e.detail;
-      this.currentSwiperIndex = current;
-    },
+      /** 默认点击遮罩关闭 */
+      onPopupVisibleChange(detail) {
+        if (!detail.visible) {
+          this.$emit('close', { trigger: 'overlay' });
+          this._trigger('visible-change', { visible: false });
+        }
+        if (this.autoClose) {
+          this.dataVisible = false;
+          this.autoClose = false;
+        }
+      },
 
-    onSelect(event, { index }) {
-      const { currentSwiperIndex, dataItems, gridThemeItems, dataCount, dataTheme } = this;
-      const isSwiperMode = dataTheme === actionSheetTheme.Grid;
-      const item = isSwiperMode ? gridThemeItems[currentSwiperIndex][index] : dataItems[index];
-      const realIndex = isSwiperMode ? index + currentSwiperIndex * dataCount : index;
+      onSwiperChange(e) {
+        const { current } = e.detail;
+        this.currentSwiperIndex = current;
+      },
 
-      if (item) {
-        this.$emit('selected', { selected: item, index: realIndex });
+      onSelect(event, { index }) {
+        const { currentSwiperIndex, dataItems, gridThemeItems, dataCount, dataTheme } = this;
+        const isSwiperMode = dataTheme === actionSheetTheme.Grid;
+        const item = isSwiperMode ? gridThemeItems[currentSwiperIndex][index] : dataItems[index];
+        const realIndex = isSwiperMode ? index + currentSwiperIndex * dataCount : index;
 
-        if (!item.disabled) {
-          this.$emit('close', { trigger: 'select' });
-          this._trigger('visible-change', { visible: false });
+        if (item) {
+          this.$emit('selected', { selected: item, index: realIndex });
+
+          if (!item.disabled) {
+            this.$emit('close', { trigger: 'select' });
+            this._trigger('visible-change', { visible: false });
+          }
         }
-      }
-    },
+      },
 
-    onCancel() {
-      this.$emit('cancel');
-      if (this.autoClose) {
-        this.dataVisible = false;
-        this.autoClose = false;
-      }
+      onCancel() {
+        this.$emit('cancel');
+        if (this.autoClose) {
+          this.dataVisible = false;
+          this.autoClose = false;
+        }
+      },
     },
-  },
-});
+  }),
+};
 </script>
 
 <style scoped src="./action-sheet.css"></style>

package/dist/action-sheet/props.ts

@@ -63,8 +63,8 @@ export default {
   usingCustomNavbar: Boolean,
   /** 显示与隐藏 */
   visible: {
-    type: Boolean,
-    default: undefined,
+    type: [Boolean, null],
+    default: null as TdActionSheetProps['visible'],
   },
   /** 显示与隐藏，非受控属性 */
   defaultVisible: Boolean,

package/dist/action-sheet/type.ts

@@ -61,7 +61,7 @@ export interface TdActionSheetProps {
    * 显示与隐藏
    * @default false
    */
-  visible?: boolean;
+  visible?: boolean | null;
   /**
    * 显示与隐藏，非受控属性
    * @default false

package/dist/avatar/README.md

@@ -8,7 +8,9 @@ isComponent: true
 
 ## 引入
 
-可在 `main.ts` 或在需要使用的页面或组件中引入。
+推荐使用 easycom 模式引入组件，配置后无需手动 import 即可直接在模板中使用 `<t-avatar />`。详细配置请参考 [快速开始](../getting-started)。
+
+如需手动引入：
 
 ```js
 import TAvatar from '@tdesign/uniapp/avatar/avatar.vue';