diff --git a/components/notification/demo/with-btn.vue b/components/notification/demo/with-btn.vue
index 8104f1fad..ed0c4a73e 100644
--- a/components/notification/demo/with-btn.vue
+++ b/components/notification/demo/with-btn.vue
@@ -37,15 +37,16 @@ export default defineComponent({
         message: 'Notification Title',
         description:
           'A function will be be called after the notification is closed (automatically after the "duration" time of manually).',
-        btn: h(
-          Button,
-          {
-            type: 'primary',
-            size: 'small',
-            onClick: () => notification.close(key),
-          },
-          'Confirm',
-        ),
+        btn: () =>
+          h(
+            Button,
+            {
+              type: 'primary',
+              size: 'small',
+              onClick: () => notification.close(key),
+            },
+            { default: () => 'Confirm' },
+          ),
         key,
         onClose: close,
       });
diff --git a/components/notification/index.tsx b/components/notification/index.tsx
index e2a800a80..9c64fe123 100644
--- a/components/notification/index.tsx
+++ b/components/notification/index.tsx
@@ -172,7 +172,8 @@ function notice(args: NotificationArgsProps) {
   const duration = args.duration === undefined ? defaultDuration : args.duration;
   getNotificationInstance(args, notification => {
     notification.notice({
-      content: ({ prefixCls }) => {
+      content: ({ prefixCls: outerPrefixCls }) => {
+        const prefixCls = `${outerPrefixCls}-notice`;
         let iconNode = null;
         if (icon) {
           iconNode = () => <span class={`${prefixCls}-icon`}>{renderHelper(icon)}</span>;