이 컴포넌트에서 actions Props는 다음과 같은 값을 받아오겠습니다.

    [
      {
        icon: 'camera-alt',
        text: '카메라로 촬영하기',
        onPress: () => {}
      },
      {
        icon: 'photo',
        text: '사진 선택하기',
        onPress: () => {}
      }
    ]

    이렇게 버튼들의 정보를 지닌 배열을 사용해 모달 내부에서 버튼을 보여줍시다. ActionSheetModal을 마저 완성해보세요.

    components/ActionSheetModal.js

    (...)
    function ActionSheetModal({visible, onClose, actions}) {
      return (
        <Modal
          visible={visible}
          transparent={true}
          animationType="fade"
          onRequestClose={onClose}>
          <Pressable style={styles.background} onPress={onClose}>
            <View style={styles.whiteBox}>
              {actions.map((action) => (
                <Pressable
                  style={styles.actionButton}
                  android_ripple={{color: '#eee'}}
                  onPress={() => {
                    action.onPress();
                    onClose();
                  }}
                  key={action.text}>
                  <Icon
                    name={action.icon}
                    color="#757575"
                    size={24}
                    style={styles.icon}
                  />
                  <Text style={styles.actionText}>{action.text}</Text>
                </Pressable>
              ))}
            </View>
          </Pressable>
        </Modal>
      );
    }
    
    (...)
    신간 소식 구독하기
    뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.