Question

我正在使用反应导航进行应用开发。当我运行log-android时，它会记录这样的事情。

导航调度：行动：{...}，新州：{...}

来自createNavigationContainer.js第150行。

我已经通过github和文档表示可以通过在顶级导航器上设置onNavigationStateChange = {null}来完成。

如何通过设置onNavigationStateChange = {null}来实现这一点，我应该在哪里设置它？

我尝试设置如下，但页面将无法重定向到其他页面。

export default () => {
 <App onNavigationStateChange={null} />
}

以下是我的app.js代码

import React, { Component } from 'react';
import { AppRegistry, StyleSheet, Text, View } from 'react-native';
import { StackNavigator,DrawerNavigator } from 'react-navigation';
import DrawerContent from './components/drawer/drawerContent.js';

import News from './components/news/home.js';

    const drawNavigation = DrawerNavigator(
      {
        Home : {
           screen : News ,
           navigationOptions : {
             header : null
           }
         }
      },
      {
        contentComponent: props => <DrawerContent {...props} />
      }
    )

    const StackNavigation = StackNavigator({
      Home : { screen : drawNavigation,
        navigationOptions: {
          header: null
        }
       }
    });


    export default StackNavigation;

这是我的drawerContent.js

import React, {Component} from 'react'
import {View,Text, StyleSheet,
  TouchableNativeFeedback,
  TouchableOpacity,
  TouchableHighlight
} from 'react-native'
import { DrawerItems, DrawerView } from 'react-navigation';
import Icon from 'react-native-vector-icons/Octicons';
import MaterialIcons from 'react-native-vector-icons/MaterialIcons';

class DrawerContent extends Component {
  constructor(props){
    super(props);
      console.log('DrawerContent|testtttttt');
  }
  render(){
    return (
      <View style={styles.container}>
        <Text>Hi darren</Text>
        <TouchableOpacity style={{ marginBottom:5 }} onPress={() => this.props.navigation.navigate('RegistrationScreen') } >
          <View style={styles.nonIconButton}>
            <Text  style={{ color: 'black',fontSize: 13 }} >Sign Up</Text>
          </View>
        </TouchableOpacity>
            <Text>Hi darren</Text>
      </View>
    );
  }
}


const styles = StyleSheet.create({
  container: {
    flex: 1,
  },
});


export default DrawerContent;

Answer 1

首先，请确保您使用react-navigation的最新版本，因为the comment noting that the fix was committed是最新版本。

根据您的代码示例，要禁用所有导航状态更改的日志记录，您可能希望替换此代码：

export default StackNavigation;

使用：

export default () => (
  <StackNavigation onNavigationStateChange={null} />
);

因为StackNavigation似乎是您的根导航器。

Answer 2

反应导航很棒，但这次记录非常糟糕。溶液

const AppNavigator = StackNavigator(SomeAppRouteConfigs);
    class App extends React.Component {
      render() {
        return (
          <AppNavigator onNavigationStateChange={null} /> 
        );
      }
    }

禁用控制台登录反应导航

2 个答案: