더북(TheBook)

7.1.2 WriteScreen에서 log 파라미터 인식하기

이제 WriteScreen에서 log 파라미터를 인식해 파라미터가 주어졌을 때 제목과 내용의 기본값을 지정해주겠습니다.

screens/WriteScreen.js

(...)

function WriteScreen({route}) {
  const log = route.params?.log;

  const [title, setTitle] = useState(log?.title ?? '');
  const [body, setBody] = useState(log?.body ?? '');

(...)

여기서 ?. 문법을 사용했는데, 이를 옵셔널 체이닝(optional chaining) 문법이라고 부릅니다. 이 문법을 사용하면 null이거나 undefined일 수 있는 객체의 프로퍼티를 에러 없이 접근할 수 있습니다. 만약 이 문법을 사용하지 않으면 다음과 같이 구현해야 하죠.

const log = route.params ? route.params.log : undefined;

const [title, setTitle] = useState(log ? log.title : '');
const [body, setBody] = useState(log ? log.body : '');

 

그리고 상태의 기본값을 설정하는 부분에서는 OR 연산자를 사용했습니다. log?.body ?? ''의 의미는 log?.body가 유효한 값이라면 해당 값을 사용하고, 그렇지 않으면 공백 문자열을 사용하라는 의미입니다.

코드를 작성한 뒤 FeedList에서 항목을 선택해 열어보세요. 항목의 내용이 WriteScreen의 텍스트 상태 초깃값으로 설정되어 있나요?

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