温馨提示:本文翻译自stackoverflow.com,查看原文请点击:其他 - React-Navigation (android) navigate error

其他 - React-Navigation(Android)导航错误

发布于 2020-03-29 12:50:33

我的英语水平很低,因为我来自韩国。然后,我需要您的帮助..我正在研究React-native(android),我想切换屏幕...但是React导航不起作用。我找到这个解决方案了1天...但是我找不到解决方案...请帮助我。

HomePage.js

import React, { Component } from 'react';
import { TouchableOpacity,StyleSheet, Text, View, Image } from 'react-native';

class HomeScreen extends React.Component {    
render() {             
  return (          
      <View style={styles.MasterContainer}>
          <NavBar/>
          <UserBar/>
          <View style={{height: 40,}}></View>
          <ButtonTab/>
          <Admob/>
          <TapBar/>
      </View>
  );
}
}

class NavBar extends React.Component {
render(){  
    const {navigation} = this.props;
    return(
        <View style={styles.NavBar}>
            <TouchableOpacity>
                <Text style={{fontWeight: 'bold',fontSize: 18, color: 'white'}} onPress ={() => 
navigation.navigate('NavPg')}>더보기</Text>
            </TouchableOpacity>
        </View>
    )
 }
}

App.js

import React from 'react';
import HomePage from './screens/HomeScreen';
import NavPage from './screens'
import {createAppContainer} from 'react-navigation';
import {createStackNavigator} from 'react-navigation-stack';

const App = createStackNavigator(
{
    Home: {screen:HomePage},
    NavPg: {screen:NavPage},
},
{initialRouteName:"Home", headerMode:'none'}
);

export default createAppContainer(App);

查看更多

查看更多

提问者
KRJaguar
被浏览
11
Mayank Pandav 2020-01-31 17:16

您可以从下面的代码使用react-navigation使用withNavigaion的HOC,希望它能工作

 import { withNavigation } from 'react-navigation';

class NavBar extends React.Component {
render(){  
    const {navigation} = this.props;
    return(
        <View style={styles.NavBar}>
            <TouchableOpacity>
                <Text style={{fontWeight: 'bold',fontSize: 18, color: 'white'}} onPress ={() => 
navigation.navigate('NavPg')}>더보기</Text>
            </TouchableOpacity>
        </View>
    )
 }
}
export default withNavigation(NavBar);

发布
问题

分享
好友

手机
浏览

扫码手机浏览