```ts
import { registerScreen } from '@ef-carbon/react-native-navigation';
import Component from './Component';
// There are various options here, see IRegisterScreenOptions
registerScreen({ Class: Component, title: 'My Specific Title' });
```
example
screen/Main/index.tsx
```ts
import Component from './Component';
export * from './Component';
// This does the registration of the component
// It can be removed and the component will work just like normal
import './register'; // tslint:disable-line:no-import-side-effect
export default Component;
```
example
screen/Main/Component.tsx
```ts
import * as React from 'react';
import { Button, View } from 'react-native';
import Navigation, { push } from '@ef-carbon/react-native-navigation';
import OtherScreen from '../OtherScreen';
import styles from './styles';
// The Main screen must have zero properties
// If this wasn't the main screen, it could have any properties
// When other screens navigate to it they will need to provide the
// necessary properties for the component
// tslint:disable-next-line:no-empty-interface
export interface IProps { }
private readonly navigateToNavigation = (): void => {
// This does type checked pushing of a new screen to the stack
// You would usually do a more production way to handle the errors
push(OtherScreen, { firstName: 'Joe', secondName: 'Bloggs' }).catch(console.error);
}
}
Used to register the screen to the library.
import OtherScreen from '../OtherScreen';
import styles from './styles';
// The Main screen must have zero properties // If this wasn't the main screen, it could have any properties // When other screens navigate to it they will need to provide the // necessary properties for the component // tslint:disable-next-line:no-empty-interface export interface IProps { }
export class MainScreen extends React.PureComponent {
// tslint:disable-next-line:no-any
render(): React.ReactElement {
return (
);
}
private readonly navigateToNavigation = (): void => { // This does type checked pushing of a new screen to the stack // You would usually do a more production way to handle the errors push(OtherScreen, { firstName: 'Joe', secondName: 'Bloggs' }).catch(console.error); } }
export interface IMainScreenStatic extends React.ComponentClass { }
const component: React.ComponentClass = MainScreen;
export { component as Component };
export default MainScreen;
`export default StyleSheet.create({ container: { flex: 1, backgroundColor: '#fff', alignItems: 'center', justifyContent: 'center' } });
`