이제 포스트 작성 화면에서 res 라우트 파라미터를 받아와 이를 Image 컴포넌트를 사용해 화면에 보여줍시다. 그리고 이미지 아래에는 TextInput을 보여주세요.

    screens/UploadScreen.js

    import {useRoute} from '@react-navigation/native';
    import React, {useEffect, useRef, useState} from 'react';
    import {
      StyleSheet,
      TextInput,
      View,
      Image,
      useWindowDimensions,
    } from 'react-native';
    
    function UploadScreen() {
      const route = useRoute();
      const {res} = route.params || {};
      const {width} = useWindowDimensions();
    
      return (
        <View style={styles.block}>
          <Image
            source={{uri: res.assets[0]?.uri}}
            style={[styles.image, {height: width}]}
            resizeMode="cover"
          />
          <TextInput
            style={styles.input}
            multiline={true}
            placeholder="이 사진에 대한 설명을 입력하세요..."
            textAlignVertical="top"
          />
        </View>
      );
    }
    
    const styles = StyleSheet.create({
      block: {
        flex: 1,
      },
      image: {width: '100%'},
      input: {
        paddingHorizontal: 16,
        paddingTop: 16,
        paddingBottom: 16,
        flex: 1,
        fontSize: 16,
      },
    });
    
    export default UploadScreen;
    신간 소식 구독하기
    뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.