u

code/base-project/base-vue/src/App.vue

@@ -1,40 +1,15 @@
 <script setup lang="ts">
-import { useNotification } from '@ao/ao-design'
-import { h } from 'vue'
 
-const notification = useNotification()
-
-function showCustomMessage() {
-  notification.success({
-    title: '测试',
-    subTitle: '测试2222222222222222222222222222222222222222222222222',
-    message: () =>
-      h('div', { style: { color: 'red', position: 'relative' } }, [
-        h(
-          'div',
-          {
-            style: {
-              position: 'absolute',
-              bottom: '4px',
-              right: '4px',
-              display: 'flex',
-              gap: '4px',
-            },
-          },
-        ),
-      ]),
-    type: 'success',
-    showClose: true,
-    duration: 0,
-  })
-}
 </script>
 
 <template>
   <div class="demo">
-    <AButton status="primary" @click="showCustomMessage">
-      自定义 h 函数消息
-    </AButton>
+    <div class="row">
+      <ATagGroup>
+        <ATag show-close>测试1</ATag>
+        <ATag show-close>测试2</ATag>
+      </ATagGroup>
+    </div>
   </div>
 </template>
 
@@ -46,4 +21,9 @@ function showCustomMessage() {
   gap: 16px;
   margin-top: 40px;
 }
+
+.row {
+  display: flex;
+  gap: 12px;
+}
 </style>

code/base-project/base-vue/src/components.d.ts

@@ -19,6 +19,9 @@ declare module 'vue' {
     APopconfirm: typeof import('@ao/ao-design')['Popconfirm']
     APopup: typeof import('@ao/ao-design')['Popup']
     ASpin: typeof import('@ao/ao-design')['Spin']
+    ATag: typeof import('@ao/ao-design')['Tag']
+    ATagGroup: typeof import('@ao/ao-design')['TagGroup']
     ATextarea: typeof import('@ao/ao-design')['Textarea']
+    ATooltip: typeof import('@ao/ao-design')['Tooltip']
   }
 }