diff --git a/ui/packages/tidb-dashboard-lib/src/apps/SlowQuery/pages/Detail/DetailTabs.tsx b/ui/packages/tidb-dashboard-lib/src/apps/SlowQuery/pages/Detail/DetailTabs.tsx
index 1dc66fc4c3..4a63ecdf07 100644
--- a/ui/packages/tidb-dashboard-lib/src/apps/SlowQuery/pages/Detail/DetailTabs.tsx
+++ b/ui/packages/tidb-dashboard-lib/src/apps/SlowQuery/pages/Detail/DetailTabs.tsx
@@ -97,9 +97,15 @@ export default function DetailTabs({ data }: { data: SlowqueryModel }) {
         key: 'warnings',
         title: t('slow_query.detail.tabs.warnings'),
         content: () => {
+          let jsonData = {}
+          if (typeof data.warnings === 'string') {
+            jsonData = JSON.parse(data.warnings)
+          } else if (typeof data.warnings === 'object') {
+            jsonData = data.warnings
+          }
           return (
             <ReactJson
-              src={data.warnings! as any}
+              src={jsonData}
               enableClipboard={false}
               displayObjectSize={false}
               displayDataTypes={false}