diff --git a/docs/.vitepress/devui-theme/components/AlgoliaSearchBox.vue b/docs/.vitepress/devui-theme/components/AlgoliaSearchBox.vue
index fee1c1c2182a403afa7bedfad6a629ed464f9540..89023a2eaea277d8fe5373a5354d6e02348dae05 100644
--- a/docs/.vitepress/devui-theme/components/AlgoliaSearchBox.vue
+++ b/docs/.vitepress/devui-theme/components/AlgoliaSearchBox.vue
@@ -2,7 +2,7 @@
 import '@docsearch/css'
 import docsearch from '@docsearch/js'
 import { useRoute, useRouter, useData } from 'vitepress'
-import { defineProps, getCurrentInstance, onMounted, watch } from 'vue'
+import { getCurrentInstance, onMounted, watch } from 'vue'
 import type { DefaultTheme } from '../config'
 import type { DocSearchHit } from '@docsearch/react/dist/esm/types'
 
diff --git a/docs/.vitepress/devui-theme/components/BuySellAds.vue b/docs/.vitepress/devui-theme/components/BuySellAds.vue
index 9a73a60ce8aef438a8bb7430d0249fa89545efb9..60e1a692301c93b676757d10e7c90269198a111f 100644
--- a/docs/.vitepress/devui-theme/components/BuySellAds.vue
+++ b/docs/.vitepress/devui-theme/components/BuySellAds.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { defineProps, onMounted } from 'vue'
+import { onMounted } from 'vue'
 
 // global _bsa
 const ID = 'bsa-cpc-script'
diff --git a/docs/.vitepress/devui-theme/components/CarbonAds.vue b/docs/.vitepress/devui-theme/components/CarbonAds.vue
index ce2b977d77269993e6bc3bb1e5ea89c0b7ecba1d..09a39bddb0373626e5a9e746a5cdf819fbeba96e 100644
--- a/docs/.vitepress/devui-theme/components/CarbonAds.vue
+++ b/docs/.vitepress/devui-theme/components/CarbonAds.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { defineProps, ref, onMounted } from 'vue'
+import { ref, onMounted } from 'vue'
 
 const { code, placement } = defineProps<{
   code: string
diff --git a/docs/.vitepress/devui-theme/components/NavBar.vue b/docs/.vitepress/devui-theme/components/NavBar.vue
index 9cf3acecca0f836cbb5c7b74ef95fe1ebc2acb15..e08715772a8115a4d9dc7e31f0763e9f97f176ce 100644
--- a/docs/.vitepress/devui-theme/components/NavBar.vue
+++ b/docs/.vitepress/devui-theme/components/NavBar.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { defineEmits, ref, watch } from 'vue'
+import { ref, watch } from 'vue'
 import Theme from '@devui/theme/theme'
 import NavBarTitle from './NavBarTitle.vue'
 import NavLinks from './NavLinks.vue'
diff --git a/docs/.vitepress/devui-theme/components/NavDropdownLink.vue b/docs/.vitepress/devui-theme/components/NavDropdownLink.vue
index 51e9a11ae1ccceb64186ae2024ca26055580b61b..eb1001fd4e2951a50eaba468587113be3865370d 100644
--- a/docs/.vitepress/devui-theme/components/NavDropdownLink.vue
+++ b/docs/.vitepress/devui-theme/components/NavDropdownLink.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { defineProps, ref, watch } from 'vue'
+import { ref, watch } from 'vue'
 import { useRoute } from 'vitepress'
 import type { DefaultTheme } from '../config'
 import NavDropdownLinkItem from './NavDropdownLinkItem.vue'
diff --git a/docs/.vitepress/devui-theme/components/NavDropdownLinkItem.vue b/docs/.vitepress/devui-theme/components/NavDropdownLinkItem.vue
index 1dec6483b3c801f4bdc54e343d5a511f78aa08ec..36a8ba03d63225d9cb89dbc7770ccae833d82fc9 100644
--- a/docs/.vitepress/devui-theme/components/NavDropdownLinkItem.vue
+++ b/docs/.vitepress/devui-theme/components/NavDropdownLinkItem.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { defineProps, toRefs } from 'vue'
+import { toRefs } from 'vue'
 import type { DefaultTheme } from '../config'
 import { useNavLink } from '../composables/navLink'
 import OutboundLink from './icons/OutboundLink.vue'
diff --git a/docs/.vitepress/devui-theme/components/NavLink.vue b/docs/.vitepress/devui-theme/components/NavLink.vue
index 9661821d8826db7af5a7ef24de1b410d5034f9ce..734fa3309d3f268424476499c58cef61332cd052 100644
--- a/docs/.vitepress/devui-theme/components/NavLink.vue
+++ b/docs/.vitepress/devui-theme/components/NavLink.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { defineProps, toRefs } from 'vue'
+import { toRefs } from 'vue'
 import type { DefaultTheme } from '../config'
 import { useNavLink } from '../composables/navLink'
 import OutboundLink from './icons/OutboundLink.vue'
diff --git a/docs/.vitepress/devui-theme/components/SideBar.vue b/docs/.vitepress/devui-theme/components/SideBar.vue
index 44085dfa4e50821f78a7429300bf8a8e7d2f8950..288c76b68ec7686c98f3aa23cb61bb32d7bf7885 100644
--- a/docs/.vitepress/devui-theme/components/SideBar.vue
+++ b/docs/.vitepress/devui-theme/components/SideBar.vue
@@ -1,5 +1,4 @@
 <script setup lang="ts">
-import { defineProps } from 'vue'
 import NavLinks from './NavLinks.vue'
 import SideBarLinks from './SideBarLinks.vue'
 
diff --git a/docs/components/anchor/index.md b/docs/components/anchor/index.md
index df0756c21a08e73b1ea590096bf8cc8b3ddd0fd9..1a3ad44ad8f8adbe90bd5d684f2d0121065685f1 100644
--- a/docs/components/anchor/index.md
+++ b/docs/components/anchor/index.md
@@ -1,4 +1,11 @@
-# anchor 锚点
+# Anchor 锚点
+
+跳转到页面指定位置的组件。
+
+### 何时使用
+
+需要在页面的各个部分之间实现快速跳转时。
+
 <script lang="ts">
   import { defineComponent } from 'vue'
   import Anchor from './demo'
@@ -10,7 +17,7 @@
 </script>
 <anchor /> 
  
-# 如何使用
+### 基本用法
 
  
 在页面中使用：
@@ -41,15 +48,15 @@
 </div>
 ```
  
-# dAnchor
+### dAnchor
 
 定义一个锚点。
 ### dAnchor 参数
 
 |     参数     |   类型   | 默认 |                         说明                          | 跳转 Demo                    |全局配置项| 
 | :----------------: | :----------: | :------: | :--: | :---------------------------------------------------: | ---------------------------- |
-|   dAnchor    | `string` |  --  |               必选，设置一个锚点的名字                | [基本用法](demo#basic-usage) |
-| anchorActive | `string` |  --  | 可选，锚点处于激活状态的时候，模块生效对应的 css 类名 | [基本用法](demo#basic-usage) |
+|   dAnchor    | `string` |  --  |               必选，设置一个锚点的名字                | [基本用法](#基本用法) |
+| anchorActive | `string` |  --  | 可选，锚点处于激活状态的时候，模块生效对应的 css 类名 | [基本用法](#基本用法) |
 
 ### dAnchor 锚点激活事件
 
@@ -62,7 +69,7 @@
 | anchor-active-by-click-inside |  点击锚点内部内容激活  |
 |   anchor-active-by-initial    |  初始化滚动条位置激活  |
 
-# dAnchorLink
+### dAnchorLink
 
 定义一个锚点的链接，点击链接会滑动到锚点，锚点处于页面顶部的时候也会激活链接的 class。
 
@@ -70,10 +77,10 @@
 
 |     参数     |   类型   | 默认 |                         说明                          | 跳转 Demo                    |全局配置项| 
 | :----------------: | :----------: | :------: | :--: | :---------------------------------------------------: | ---------------------------- |
-| dAnchorLink  | `string` |  --  |            必选，点击滑动的目标锚点的名字             | [基本用法](demo#basic-usage) |
-| anchorActive | `string` |  --  | 可选，锚点处于激活状态的时候，链接生效对应的 css 类名 | [基本用法](demo#basic-usage) |
+| dAnchorLink  | `string` |  --  |            必选，点击滑动的目标锚点的名字             | [基本用法](#基本用法) |
+| anchorActive | `string` |  --  | 可选，锚点处于激活状态的时候，链接生效对应的 css 类名 | [基本用法](#基本用法) |
 
-# dAnchorBox
+### dAnchorBox
 
 必须有一个容器，否则功能无法使用。
 
diff --git a/docs/components/breadcrumb/index.md b/docs/components/breadcrumb/index.md
index fd4499ac4bc6925b40c7087b1fdff23028ff4afe..2289ae81233295cb21ba0883e0bcec576b49aa5c 100644
--- a/docs/components/breadcrumb/index.md
+++ b/docs/components/breadcrumb/index.md
@@ -1,8 +1,8 @@
-# Breadcrumb
+# Breadcrumb 面包屑
 
 显示当前页面层级的组件。
 
-**何时使用**
+### 何时使用
 
 1. 用户需要了解当前出于什么层级时；
 2. 用户需要快速返回之前的层级时；
diff --git a/docs/components/cascader/index.md b/docs/components/cascader/index.md
index 88e98169a7e3e0f676a2c72975db7cad7db6ec89..1c310e940526131358058a60a2b1f1b369876ce8 100644
--- a/docs/components/cascader/index.md
+++ b/docs/components/cascader/index.md
@@ -1,6 +1,12 @@
-# 级联菜单
+# Cascader 级联菜单
+
 下拉级联菜单。
 
+### 何时使用
+
+1. 需要从一组相关联的数据集合进行选择，例如省市区，公司层级，事物分类等。
+2. 从一个较大的数据集合中进行选择时，用多级分类进行分隔，方便选择。
+
 ### 基本用法
 :::demo
 
diff --git a/docs/components/date-picker/index.md b/docs/components/date-picker/index.md
index f9701f651ee5512b1f615371fda98256bc487fff..bbc53a7a363c1e079092e051a70ad47bfe83926e 100644
--- a/docs/components/date-picker/index.md
+++ b/docs/components/date-picker/index.md
@@ -1,3 +1,11 @@
+# DatePicker 日期选择器
+
+输入或选择日期的组件。
+
+### 何时使用
+
+当用户需要输入一个日期时；需要点击标准输入框，弹出日期面板进行选择时。
+
 <script lang="ts">
 import { defineComponent, ref } from 'vue'
 export default defineComponent({
@@ -16,10 +24,6 @@ export default defineComponent({
 })
 </script>
 
-# DatePicker 日期选择器
-
-日期、时间可视化输入。
-
 ### 属性 auto-close
 
 |项目|说明|
diff --git a/docs/components/input-number/index.md b/docs/components/input-number/index.md
index 60b0f36679f64cb49445f800b22a402eaa863cfe..74bc4c9b08398f06b35d8c166ba634314826ad09 100644
--- a/docs/components/input-number/index.md
+++ b/docs/components/input-number/index.md
@@ -1,7 +1,10 @@
-# InputNum 数字输入框
+# InputNumber 数字输入框
 
-数字输入框仅允许输入标准的数字值，可定义范围。
+数字输入框组件。
 
+### 何时使用
+
+当需要获取标准数值时。
 
 ### 基本用法
 
diff --git a/docs/components/rate/index.md b/docs/components/rate/index.md
index 021bf9cb3ef8ec7bd820c0023b03ab2dfce4ec2d..ab3f6ff327c98decec3c700d2f4852d2a0b4a74c 100644
--- a/docs/components/rate/index.md
+++ b/docs/components/rate/index.md
@@ -2,7 +2,8 @@
 
 等级评估。
 
-何时使用  
+### 何时使用
+
 用户对一个产品进行评分时可以使用。
 
 ### Demo
diff --git a/docs/components/search/index.md b/docs/components/search/index.md
index a47a8355d2bf0f0c64d3e493ef69541f3543c087..97d61245108d3272d3158b1ae026903170b0984a 100644
--- a/docs/components/search/index.md
+++ b/docs/components/search/index.md
@@ -1,5 +1,11 @@
 # Search 搜索框
 
+搜索框。
+
+### 何时使用
+
+当用户需要在数据集中搜索所需数据时，输入所需数据的内容（或部分内容），返回所有匹配内容的搜索结果。
+
 ### 基本用法
 
 :::demo 使用`sm`，`''`，`lg`来定义`Search`基本类型
diff --git a/docs/components/select/index.md b/docs/components/select/index.md
index 5440b1c701421c85c04c4995e22167598e44b1f2..2cac4481bf263c147818d8c7b929c46c9078ead5 100644
--- a/docs/components/select/index.md
+++ b/docs/components/select/index.md
@@ -1,6 +1,10 @@
 # Select 下拉选择框
 
-用于从列表中选择单个或者多个数据
+下拉选择框。
+
+### 何时使用
+
+用户可以从多个选项中选择一项或几项；仅支持用户在下拉选项中选择和搜索系统提供的选项，不支持输入。
 
 ### 基本用法
 
diff --git a/docs/components/sticky/index.md b/docs/components/sticky/index.md
index e3acf7c0334a6204896fccae94b1efbc6182c017..9839071bbce9e90dea16e1c4e066b89118752d6d 100644
--- a/docs/components/sticky/index.md
+++ b/docs/components/sticky/index.md
@@ -1,6 +1,9 @@
-# sticky 便贴
+# Sticky 便贴
+
+便签组件。
 
 ### 何时使用
+
 当用户在滚动屏幕时，需要某个区域内容在段落或者浏览器可视区域可见时。
 
 ### 基本用法