| 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; |