컴포넌트 스타일을 지정할 때 여러 스타일을 적용하고 싶다면 다음과 같이 배열 형태로 설정하면 됩니다.

<View style={[styles.box, styles.rounded]} />

코드를 저장하고 사각형의 모서리가 부드러워졌는지 확인해보세요.

▲ 그림 2-9 rounded 스타일 적용

이제 rounded라는 props가 true일 때만 이 스타일을 부여해봅시다. Box 컴포넌트를 다음과 같이 수정해보세요.

components/Box.js

import React from 'react';
import {View, StyleSheet} from 'react-native';

function Box(props) {
  return <View style={[styles.box, props.rounded ? styles.rounded : null]} />;
}

(...)