diff --git a/src/views/search/search.module.css b/src/views/search/search.module.css
index 2e1f40a..4475d20 100644
--- a/src/views/search/search.module.css
+++ b/src/views/search/search.module.css
@@ -130,3 +130,28 @@
   display: flex;
   justify-content: flex-end;
 }
+
+
+.secondaryHeader {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-start;
+  padding: 16px;
+  border-bottom: 1px solid var(--primary-color);
+  background-color: var(--light-color);
+}
+
+.results {
+  margin-top: 20px;
+  padding: 20px;
+}
+
+.resultList {
+  list-style: none;
+  padding: 0;
+}
+
+.resultItem {
+  border-bottom: 1px solid var(--primary-color);
+  padding: 12px 0;
+}
diff --git a/src/views/search/search.tsx b/src/views/search/search.tsx
index 6dba69c..bf252c5 100644
--- a/src/views/search/search.tsx
+++ b/src/views/search/search.tsx
@@ -2,6 +2,7 @@
 import React, { useState, useEffect } from 'react';
 import styles from './search.module.css';
 import { useLocation } from "react-router-dom";
+import { getSearch } from '@/api/search'
 
 interface PostItem {
   postId: number;
@@ -32,19 +33,49 @@
     11: "table",
   },
   video: {
-    20: "视频标签1",
-    21: "视频标签2",
-    22: "视频标签3",
+    20: "chinese",
+    21: "America",
+    22: "Japan",
+    23: "Koera",
+    24: "Europe",
+    25: "other",
+    26: "Short",
+    27: "plot",
+    28: "comedy",
+    29: "love",
+    30: "action",
+    31: "terror",
+    32: "science fiction",
+    33: "commit a crime",
+    34: "Thriller",
   },
   music: {
-    40: "音乐标签1",
-    41: "音乐标签2",
-    42: "音乐标签3",
+    40: "chinese",
+    41: "America",
+    42: "Japan",
+    43: "Korea",
+    44: "Europe",
+    45: "other",
+    46: "rap",
+    47: "Electric sound",
+    48: "Guofeng",
+    49: "motion",
+    50: "ballad",
+    51: "Rock and roll",
+    52: "classical",
   },
   software: {
-    60: "软件标签1",
-    61: "软件标签2",
-    62: "软件标签3",
+    60: "android",
+    61: "mac",
+    62: "pc",
+    63: "ios",
+    64: "other",
+    65: "life",
+    66: "shopping",
+    67: "video",
+    68: "music",
+    69: "read",
+    70: "system",
   },
 };
 
@@ -64,13 +95,34 @@
   };
 
   useEffect(() => {
-    fetch('/api/posts')
-      .then((res) => res.json())
-      .then((data) => {
+    if (!keyword) return;
+
+    const requestBody = {
+      keyword,
+      tags: [] // 可以为空
+    };
+
+  console.log("请求发送:", getSearch, requestBody);
+
+
+    fetch(getSearch, {
+      method: 'Get',
+      headers: {
+        'Content-Type': 'application/json'
+      },
+      body: JSON.stringify(requestBody)
+    })
+      .then(res => res.json())
+      .then((res) => {
+        const data: PostItem[] = res.data;
         setPosts(data);
         setFilteredPosts(data);
+      })
+      .catch((error) => {
+        console.error('搜索请求失败:', error);
       });
-  }, []);
+  }, [keyword]);
+
 
   const applyFilters = () => {
     let filtered = posts;
@@ -94,6 +146,7 @@
   };
 
   return (
+    <div>
     <div className={styles.secondaryHeader}>
     <div className={styles.leftSection}>
         <select
@@ -154,6 +207,26 @@
     </div>
     </div>
 
+    <div className={styles.results}>
+      {filteredPosts.length === 0 ? (
+        <p>暂无搜索结果</p>
+      ) : (
+        <ul className={styles.resultList}>
+          {filteredPosts.map((post) => (
+            <li key={post.postId} className={styles.resultItem}>
+              <h3>{post.postTitle || '无标题'}</h3>
+              <p>{post.postContent || '无内容'}</p>
+              <p>类型：{post.postType || '未知'} | 热度评分：{post.hotScore}</p>
+            </li>
+          ))}
+        </ul>
+      )}
+    </div>
+
+  </div>
+
+        
+
   );
 };