diff --git a/package.json b/package.json
index 7157d28..5292579 100644
--- a/package.json
+++ b/package.json
@@ -47,7 +47,7 @@
     "@rc-component/input": "~1.3.1",
     "@rc-component/menu": "~1.6.0",
     "@rc-component/trigger": "^3.0.0",
-    "@rc-component/util": "^1.11.1",
+    "@rc-component/util": "^1.13.0",
     "clsx": "^2.1.1"
   },
   "devDependencies": {
diff --git a/src/Mentions.tsx b/src/Mentions.tsx
index 79b415b..1f3ae35 100644
--- a/src/Mentions.tsx
+++ b/src/Mentions.tsx
@@ -7,6 +7,7 @@ import type {
   TextAreaRef,
 } from '@rc-component/input';
 import {
+  isReactRenderable,
   KeyCode,
   toArray,
   useControlledState,
@@ -662,7 +663,8 @@ const Mentions = forwardRef<MentionsRef, MentionsProps>(
     },
     ref,
   ) => {
-    const hasSuffix = !!(suffix || allowClear);
+    const hasSuffix = isReactRenderable(suffix) || Boolean(allowClear);
+    const suffixNode = isReactRenderable(suffix) ? <>{suffix}</> : suffix;
 
     // =============================== Ref ================================
     const holderRef = useRef<HolderRef>(null);
@@ -693,7 +695,7 @@ const Mentions = forwardRef<MentionsRef, MentionsProps>(
 
     return (
       <BaseInput
-        suffix={suffix}
+        suffix={suffixNode}
         prefixCls={prefixCls}
         value={mergedValue}
         allowClear={allowClear}