screens/ProfileScreen.js

import {useNavigation, useRoute} from '@react-navigation/native';
import React from 'react';
import {useEffect} from 'react';
import Profile from '../components/Profile';

function ProfileScreen() {
  const route = useRoute();
  const navigation = useNavigation();
  const {userId, displayName} = route.params ?? {};

  useEffect(() => {
    navigation.setOptions({
      title: displayName,
    });
  }, [navigation, displayName]);

  return <Profile userId={userId} />;
}

export default ProfileScreen;

이 화면은 라우트 파라미터로 userId와 displayName을 받아옵니다. userId는 Profile 컴포넌트의 Props로 사용되고, displayName은 화면의 타이틀로 설정됩니다.

컴포넌트를 다 만들었으면, 이 화면을 HomeStack에 등록하세요.