React Native style не отображается с использованием style.container

Question

Я изучаю React Native и применяю некоторые простые стили к View.Но стиль не появляется вообще.Что я делаю не так?

import React, { Component } from 'react'
import { Text, View } from 'react-native'

export default class Header extends Component {
  render() {
    return (
      <View style={styles.container}>
        <Text> Hello </Text>
      </View>
    )
  }
}

const styles = {
    container: {
        backgrounColor: '#ddd',
        color: 'red',
        paddingTop: 14
    }
}

Если я изменю его на <View style={{backgroundColor: '#ddd', color: 'red', paddingTop: 14}}>, это будет работать, но почему не будет работать первый подход?

Я использую:

Reaction-native-cli: 2.0.1 и Reaction-native: 0.57.8

Answer 1

Вам нужно использовать таблицу стилей для создания стилей JavaScript в реагирующем языке

Импортировать таблицу стилей из реагирующего языка и изменить свой переменный стиль на:

const styles = StyleSheet.create({
    container: {
        backgrounColor: '#ddd',
        color: 'red',
        paddingTop: 14
    }
});