더북(TheBook)

Articles 컴포넌트를 수정한 다음, ArticlesScreen에서 이 컴포넌트를 사용할 때 사용자가 로그인되어 있다면 showWriteButtontrue로 지정해주세요.

screens/ArticlesScreen.tsx

import React from 'react';
import {ActivityIndicator, StyleSheet} from 'react-native';
import {useQuery} from 'react-query';
import {getArticles} from '../api/articles';
import Articles from '../components/Articles';
import {useUserState} from '../contexts/UserContext';

function ArticlesScreen() {
  const {data} = useQuery('articles', getArticles);
  const [user] = useUserState();

  if (!data) {
    return (
      <ActivityIndicator size="large" style={styles.spinner} color="black" />
     );
  }

  return <Articles articles={data} showWriteButton={!!user} />;
}

const styles = StyleSheet.create({
  spinner: {
    flex: 1,
  },
});

export default ArticlesScreen;

여기서 !!user라는 표현을 사용했는데, 이는 user 값이 유효하다면 true를 가리키고 그렇지 않다면 false를 가리키는 표현입니다.

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