Реагируйте на навигацию, не переходя на другой экран

Question

Я пытаюсь перейти на другой экран, используя TouchableHighlight / кнопку, но он не переходит на другой экран. ошибок нет. Ничего не происходит, когда я нажимаю кнопку TouchableHighlight / на том же экране.

trackButton() {
    const navigation = this.props.navigation;


    return (
        <View style={styles.footer}>
            {/* <TouchableHighlight underlayColor='transparent' onPress={() => this.gotoTrackingScreen()}> */}
            <TouchableHighlight underlayColor='transparent' onPress={() => this.props.navigation.navigate('faq')}>


                <Text style={this.trackingButtonStyleOS()}>
                    START TRACKING
                </Text>
            </TouchableHighlight>  
            {/* <Button
      onPress={() => this.props.navigation.navigate('Tracking')}
      title="Chat with Lucy"
    /> */}

        </View>
    );
}

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

StackNavigator реализован в index.android.js

const BeaconApp = StackNavigator({ Home: { screen: App, navigationOptions: { header: null } }, Tracking: { screen: TrackingScreen, navigationOptions: { header: null } }})

Answer 1

Я думаю, что название вашего компонента не соответствовало стандартам. Я видел, что вы пытаетесь создать компонент trackButton, который позже будет реализован TrackingScreen.React определит функцию как компонент, если он написан в UpperCamelCase , а не в lowerCamelCase. Реквизит не будет получен в вашем компоненте, потому что он будет считаться обычной функцией, а обычная функция не имеет функции передачи реквизита.

Из-за этого ваш компонент trackButton не получил props.navigation, и при нажатии кнопки ничего не происходит.