Не удается прочитать свойство undefined в стиле React Native

Question

Я пытаюсь получить доступ к своему свойству styles как обычно, однако получаю сообщение об ошибке: Cannot read property 'swipeButtonCommon' of undefined.

Ну, мой styles объект определен как имеющий swipeButtonCommon в любом случае:

const styles = StyleSheet.create({
    ...
    swipeButtonCommon:{
        backgroundColor: Color.listActionBackground
    },
   ...
   //swipeButtonLeft and swipeButtonRight are also defined
})

function SwipeButton(title:string, side: 'left' | 'center' | 'right'){
    let styleClass: string | null = null;

    if(side == 'left'){
        styleClass = 'swipeButtonLeft';
    }else if(side == 'right'){
        styleClass = 'swipeButtonRight'
    }
    return (
        <View style={[styles.swipeButtonCommon, styles[styleClass!]]}><Text>{title}</Text></View>
    )
}

Я получаю сообщение об ошибке в строке <View style={...}, и хотя у меня установлена ​​точка останова, по какой-то причине она не срабатывает. Я очистил кэш Metro Bundler и карту модуля Haste и перезапустил почти все, но безрезультатно. Что я делаю не так?

Answer 1

Я нашел проблему. Я использовал function ComponentName() синтаксис, к которому я обычно не привык. Я переключился на обычный class ComponentName extends Component синтаксис, и проблема исчезла.