diff --git a/Merge/front/src/components/FollowButton.jsx b/Merge/front/src/components/FollowButton.jsx
new file mode 100644
index 0000000..0776191
--- /dev/null
+++ b/Merge/front/src/components/FollowButton.jsx
@@ -0,0 +1,33 @@
+import React from 'react';
+import { followUser, unfollowUser } from '../api/api_ljc';
+
+const FollowButton = ({ userId, isFollowing, onFollowChange }) => {
+  const handleFollow = async () => {
+    try {
+      if (isFollowing) {
+        await unfollowUser(userId);
+        onFollowChange(false);
+      } else {
+        await followUser(userId);
+        onFollowChange(true);
+      }
+    } catch (error) {
+      console.error('关注操作失败:', error);
+    }
+  };
+
+  return (
+    <button 
+      onClick={handleFollow}
+      className={`px-6 py-2 rounded-full text-sm font-medium transition-all ${
+        isFollowing 
+          ? 'bg-gray-100 text-gray-800 hover:bg-gray-200' 
+          : 'bg-red-500 text-white hover:bg-red-600'
+      }`}
+    >
+      {isFollowing ? '已关注' : '关注'}
+    </button>
+  );
+};
+
+export default FollowButton;
\ No newline at end of file