No estoy muy seguro de cómo está sucediendo esto, aparentemente he escrito todos mis accesorios, pero estoy tratando de pasar el navegador a mi componente de la barra inferior para poder navegar en onPress .

Primero declaro la interfaz de accesorios:

 export interface BottomBarProps { owner: string; navigation: NavigationProp<ParamListBase>; }

Entonces el componente de clase:

 class BottomBar extends React.Component<any, any> { constructor() { super({}); this.state = { loaded: false, } } navigateTo(page : string) { if (this.props.owner == page) { return; } this.props.navigation.navigate(page) } render() { return ( <Appbar style={styles.bottom}> <Appbar.Action color={this.props.owner == "home" ? "white" : "#311b92"} icon="home" size={iconSize} onPress={() => this.navigateTo("home")} /> <Appbar.Action color={this.props.owner == "profile" ? "white" : "#311b92"} icon=“profile” size={iconSize} onPress={() => this.navigateTo("profile")} /> </Appbar> ); } }

console.log(this.props.navigation resultados:

 Object { "navigation": Object { "addListener": [Function addListener], "canGoBack": [Function canGoBack], "dispatch": [Function dispatch], "getParent": [Function getParent], "getState": [Function anonymous], "goBack": [Function anonymous], "isFocused": [Function isFocused], "navigate": [Function anonymous], "pop": [Function anonymous], "popToTop": [Function anonymous], "push": [Function anonymous], "removeListener": [Function removeListener], "replace": [Function anonymous], "reset": [Function anonymous], "setOptions": [Function setOptions], "setParams": [Function anonymous], }, "route": Object { "key": "Home-0RS-tZ-9F2bbVZQ61Hb3a", "name": "Home", "params": undefined, "path": undefined, }, }

De hecho, puedo ver que navigate es una función. Entonces, ¿qué está pasando aquí?