修正帖子列表、帖子详情的头像与名字显示问题
Change-Id: Ibcb01510f9474ea43c8739f3013c3aaa32e32640
diff --git a/Merge/front/src/components/FollowButton.jsx b/Merge/front/src/components/FollowButton.jsx
index 0776191..3e94161 100644
--- a/Merge/front/src/components/FollowButton.jsx
+++ b/Merge/front/src/components/FollowButton.jsx
@@ -1,31 +1,50 @@
-import React from 'react';
+import React, { useState } from 'react';
import { followUser, unfollowUser } from '../api/api_ljc';
-const FollowButton = ({ userId, isFollowing, onFollowChange }) => {
+const FollowButton = ({ userId, isFollowing, onFollowChange, style }) => {
+ const [loading, setLoading] = useState(false);
const handleFollow = async () => {
+ if (loading) return;
+ setLoading(true);
try {
+ console.log('FollowButton clicked, isFollowing:', isFollowing, 'userId:', userId);
if (isFollowing) {
- await unfollowUser(userId);
+ const res = await unfollowUser(userId);
+ console.log('unfollowUser response:', res);
onFollowChange(false);
} else {
- await followUser(userId);
+ const res = await followUser(userId);
+ console.log('followUser response:', res);
onFollowChange(true);
}
} catch (error) {
+ alert('关注操作失败，请重试！');
console.error('关注操作失败:', error);
+ } finally {
+ setLoading(false);
}
};
return (
- <button
+ <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'
- }`}
+ disabled={loading}
+ style={{
+ border: 'none',
+ outline: 'none',
+ borderRadius: 20,
+ padding: '6px 22px',
+ fontSize: 15,
+ fontWeight: 600,
+ cursor: loading ? 'not-allowed' : 'pointer',
+ background: isFollowing ? '#f5f5f5' : 'linear-gradient(90deg,#ff4b2b,#ff416c)',
+ color: isFollowing ? '#888' : '#fff',
+ boxShadow: isFollowing ? 'none' : '0 2px 8px #ff416c22',
+ transition: 'all 0.2s',
+ ...style
+ }}
>
- {isFollowing ? '已关注' : '关注'}
+ {loading ? '处理中...' : isFollowing ? '已关注' : '+ 关注'}
</button>
);
};