StackNavigator的navigate无效



  • /**
     * Sample React Native App
     * https://github.com/facebook/react-native
     * @flow
     */
    import React, {Component} from 'react';
    import { StackNavigator } from 'react-navigation';
    
    import {
        StyleSheet,
        TabBarIOS,
        Text,
        View,
        Button,
        ListView,
        TouchableHighlight,
        Alert,
        Image,
        SampleText,
        ScrollView,
        Dimensions,
    } from 'react-native';
    
    
    
    class ChatScreen extends React.Component {
        static navigationOptions = ({navigation}) => ({
            title: navigation.state.params.name,
        });
        render() {
            const { goBack } = this.props.navigation;
            return (
                <Button
                    title="Go back"
                    onPress={() => goBack()}
                />
            );
        }
    }
    
    class AllClassesController extends React.Component {
    
        static navigationOptions = {
            tabBarLabel: '分类',
            headerTitle:'分类',
            tabBarIcon: ({ tintColor }) => (
                <Image
                    source={require('../images/test@2x.png')}
                    style={[styles.icon, {tintColor: tintColor}]}
                />
            ),
        };
    
      
    
        constructor(props){
            super(props);
            this.state = {
                data:null,
            };
        }
    
    
        render() {
            const { navigate } = this.props.navigation;
    
          
                return (
    
               
                    <Button title="Go to Jane's profile"
                    onPress={() => navigate('Chat', { name: 'Jane' })} />
                );
        }
    
     
    }
    
    const styles = StyleSheet.create({
        container: {
            flex: 1,
            backgroundColor: '#EEEEEE',
            justifyContent:'center',
            // alignItems:'center',
        },
        cellText: {
            top: 10,
            left: 10,
            right: 10,
            height: 25,
            textAlign: 'justify',
            // backgroundColor:"#FF0000",
        },
    
        subText: {
            width: Dimensions.get('window').width - 120,
            margin: 10,
            color: '#787d75',
            textAlign: 'justify',
            fontSize: 12,
            lineHeight: 16,
        },
    
        arrow: {
            right: 5,
            color: '#686868',
        },
    
        listviewStyle: {
            backgroundColor: 'white',
            borderColor: '#d5d5d5',
            borderBottomWidth: 0.5,
            height: 80,
            justifyContent: 'flex-start',
            flexDirection: 'row',
            alignItems: 'center',
    
        },
    
        leftViewStyle: {
            width: 5,
            height: 80,
        },
    
        tab: {},
        tabContent: {
            flex: 1,
            alignItems: 'center',
        },
        tabText: {
            color: 'white',
            margin: 100,
        },
    
        imgStyle: {
            // 设置宽度
            width: 80,
            // 设置高度
            height: 80,
            borderWidth: 0,
        }
    });
    
    
    const SimpleApp = StackNavigator(
        {
            Root: { screen: AllClassesController },
        },
        {
            Chat: { screen: ChatScreen },
        },
    );
    
    module.exports = SimpleApp;
    

    代码如下,为什么() => navigate('Chat', { name: 'Jane' })无效呢,不报错,没任何反应。 (无关代码有删减);求各位帮忙看下。


登录后回复