더북(TheBook)

이제 이 함수를 ModifyScreen에서 사용해봅시다!

screens/ModifyScreen.js

import {useNavigation, useRoute} from '@react-navigation/native';
import React, {useState, useEffect, useCallback} from 'react';
import {
  StyleSheet,
  TextInput,
  Platform,
  KeyboardAvoidingView,
} from 'react-native';
import IconRightButton from '../components/IconRightButton';
import {updatePost} from '../lib/posts';

function ModifyScreen() {
  const navigation = useNavigation();
  const {params} = useRoute();
  // 라우트 파라미터의 description을 초깃값으로 사용
  const [description, setDescription] = useState(params.description);

  const onSubmit = useCallback(async () => {
    await updatePost({
      id: params.id,
      description,
    });
    // TODO: 포스트 및 포스트 목록 업데이트
    navigation.pop();
  }, [navigation, params.id, description]);

(...)

코드를 다 작성했으면 설명을 수정한 뒤 ModifyScreen 우측 상단의 체크 버튼을 눌러보세요. 아직 변화를 앱 상태에 바로 반영하지 않으므로, 앱을 리로딩해야 반영된 것을 확인할 수 있습니다.

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.