问Next.js链接不强制组件呈现，serverSideProps不更新

EN

<li>
      <Link href={`/profile/${user.user.id}`}>
             <a className="flex flex-row items-center">
                 <BiUserCircle />
                 <span className="ml-1">Profile</span>
             </a>
      </Link>
</li>

const Profile = ({ initialProfile, posts }) => {
    const router = useRouter();
    const [profile, setProfile] = useState(initialProfile);
    const { userId } = router.query;
    const dispatch = useDispatch();

    useEffect(() => {
        // This is my current solution, however it feels really hacky
        fetchProfile();
    }, [userId]);

    const fetchProfile = async () => {
        const resp = await axios.get(apiURL + `accounts/users/${userId}`);
        setProfile((prof) => ({ ...prof, ...resp.data }));
    };

    return (
        <Layout>
            <ProfileSummary
                isUser={isUser}
                isFollowed={isFollowed}
                handleFollow={handleFollow}
                profile={profile}
            />
            {isUser ? (
                <div className="flex justify-center">
                    <Button colorScheme="green">Add post</Button>
                </div>
            ) : null}
            <div className="w-full flex justify-center flex-col items-center pl-2 pr-2">
                {posts
                    ? posts.map((post) => (
                          <Card
                              key={post.id}
                              author={post.author}
                              likes={post.likes}
                              desc={post.description}
                              img={post.image}
                              isLiked={post.is_liked}
                              postId={post.id}
                              comments={post.comments}
                          />
                      ))
                    : "No Posts found"}
            </div>
        </Layout>
    );
};

export async function getServerSideProps(context) {
    const { userId } = context.query;

    const profileResp = await axios.get(apiURL + `accounts/users/${userId}`);
    const postsResp = await axios.get(
        apiURL + `posts/?author__id=${profile.id}`
    );

    const profile = profileResp.data;
    const posts = postsResp.data;

    return {
        props: {
            initialProfile: profile,
            posts,
        },
    };
}

export default Profile;