Реакция-навигация передает реквизиты к компоненту класса

Question

Предположим, у меня есть следующий фрагмент кода для создания DrawerNavigator

export const DrawerApp = DrawerNavigator({
    PageHome: {
        screen: InboxScreen
    },
},
{
    contentComponent: props => <RightMenuScreen />,
    drawerPosition: 'right'
});

Я прочитал из примера здесь, что я могу передать реквизит, как banner поддержать функциональный компонент, используя синтаксис, такой как

const MyNavScreen = ({ navigation, banner }) => (<View><Text>{banner}</Text></View>);
// ...
// ...
// ...
const InboxScreen = ({ navigation }) => (
    <MyNavScreen banner={'InboxScreen'} navigation={navigation} />
);

Но что, если я объявлю свой Компонент, используя класс Компонент, как я могу заархивировать то же самое поведение, передавая свой собственный реквизит в MyNavScreen

class InboxScreen extends Component {

    render() {
        // here I want to get a prop like `banner` or `callback` from props
    }
}

Answer 1

Используя this.props вы можете достичь того же

class InboxScreen  extends Component{
static navigationOptions = {
  drawerLabel: 'Inbox',
  drawerIcon: ({ tintColor }) => (
    <MaterialIcons
      name="move-to-inbox"
      size={24}
      style={{ color: tintColor }}
    />
  ),
};
render (){
  return(
  <MyNavScreen banner={'Inbox Screen'} navigation={this.props.navigation} />
  );
}
}