diff --git a/examples/sites/demos/apis/popconfirm.js b/examples/sites/demos/apis/popconfirm.js
index bd5376c8f..7658a81de 100644
--- a/examples/sites/demos/apis/popconfirm.js
+++ b/examples/sites/demos/apis/popconfirm.js
@@ -162,12 +162,27 @@ export default {
defaultValue: '',
desc: {
'zh-CN': '底部插槽',
- 'en-US': 'default slot'
+ 'en-US': 'footer slot'
},
mode: ['pc', 'mobile-first'],
pcDemo: 'slot-footer',
mfDemo: ''
},
+ {
+ name: 'message',
+ type: '',
+ defaultValue: '',
+ meta: {
+ stable: '3.22.2'
+ },
+ desc: {
+ 'zh-CN': '信息插槽',
+ 'en-US': 'message slot'
+ },
+ mode: ['pc', 'mobile-first'],
+ pcDemo: 'slot-message',
+ mfDemo: ''
+ },
{
name: 'reference',
type: '',
diff --git a/examples/sites/demos/pc/app/popconfirm/slot-message-composition-api.vue b/examples/sites/demos/pc/app/popconfirm/slot-message-composition-api.vue
new file mode 100644
index 000000000..2baf6d070
--- /dev/null
+++ b/examples/sites/demos/pc/app/popconfirm/slot-message-composition-api.vue
@@ -0,0 +1,22 @@
+
+
+
+
+ 悬浮我提示
+
+
+ {{ customMessage }}
+
+
+
+
+
+
diff --git a/examples/sites/demos/pc/app/popconfirm/slot-message.spec.ts b/examples/sites/demos/pc/app/popconfirm/slot-message.spec.ts
new file mode 100644
index 000000000..6c2580d22
--- /dev/null
+++ b/examples/sites/demos/pc/app/popconfirm/slot-message.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义消息内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('popconfirm#slot-message')
+
+ const demo = page.locator('#slot-message')
+ const popconfirm = demo.locator('.tiny-popconfirm')
+
+ await expect(popconfirm).toContainText('这是气泡确认框自定义提示内容文本描述。')
+})
diff --git a/examples/sites/demos/pc/app/popconfirm/slot-message.vue b/examples/sites/demos/pc/app/popconfirm/slot-message.vue
new file mode 100644
index 000000000..fbdab2048
--- /dev/null
+++ b/examples/sites/demos/pc/app/popconfirm/slot-message.vue
@@ -0,0 +1,30 @@
+
+
+
+
+ 悬浮我提示
+
+
+ {{ customMessage }}
+
+
+
+
+
+
diff --git a/examples/sites/demos/pc/app/popconfirm/webdoc/popconfirm.js b/examples/sites/demos/pc/app/popconfirm/webdoc/popconfirm.js
index acb2efe91..50815aee6 100644
--- a/examples/sites/demos/pc/app/popconfirm/webdoc/popconfirm.js
+++ b/examples/sites/demos/pc/app/popconfirm/webdoc/popconfirm.js
@@ -78,6 +78,18 @@ export default {
},
codeFiles: ['slot-footer.vue']
},
+ {
+ demoId: 'slot-message',
+ name: {
+ 'zh-CN': '消息插槽',
+ 'en-US': 'Message slot'
+ },
+ desc: {
+ 'zh-CN': '
通过 message 插槽自定义消息内容。
',
+ 'en-US': 'Customize the message content through themessageslot.
'
+ },
+ codeFiles: ['slot-message.vue']
+ },
{
demoId: 'width',
name: {
diff --git a/packages/vue/src/popconfirm/src/pc.vue b/packages/vue/src/popconfirm/src/pc.vue
index f256d6e58..abf250c3b 100644
--- a/packages/vue/src/popconfirm/src/pc.vue
+++ b/packages/vue/src/popconfirm/src/pc.vue
@@ -27,7 +27,9 @@
- {{ message }}
+
+ {{ message }}
+