Реагировать на проблемы с навигацией - PullRequest
0 голосов
/ 05 июня 2019

Помогите мне, пожалуйста.Я делаю мобильное приложение.У меня есть нижняя вкладка навигации, которая делает навигацию между 3 основными страницами.Я сделал навигацию между 1-й страницей и второй, но не с навигацией внизу вкладки, с кнопкой.Когда я сделал это, у меня нет чего-то, чего я хочу.Я буду очень рад, если вы мне поможете.Когда я перехожу ко второй странице с первой, у меня есть 2 заголовка.Но я хочу сделать 1: enter image description here

там 2 заголовка, первый - <, а второй - «Курсы», я хочу сделать так: «<Курсы».Помоги мне, пожалуйста.Код: </p>

// 1st page

import Courses from './Courses'

<Button
onPress={() => {
   navigate('Courses')
}}
 title="More courses"
/>

  const RootStack = createStackNavigator(
    {
      Home: {
        screen: HomeScreen,
      },
      Courses: {
        screen: Courses,
      },
      Details: {
        screen: DetailsScreen,
      },
    },
    {
      initialRouteName: 'Home',
    }
  );

  const AppContainer = createAppContainer(RootStack);

  export default class App extends React.Component {
    render() {
      return <AppContainer />;
    }
  }

App.js

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

import { createBottomTabNavigator, createAppContainer } from 'react-navigation';

import Icon from 'react-native-vector-icons/Ionicons'
import Home from './screens/Home'
import Courses from './screens/Courses'
import Editor from './screens/Editor'
import AppNavigator from './AppNavigator';



const TabNavigator = createBottomTabNavigator({
  Home:{
    screen:Home,
    navigationOptions:{
      tabBarLabel:'Home',
      tabBarIcon:({tintColor})=>(
        <Icon name="ios-home" color={tintColor} size={24} />
      )
    }
  },

  Courses:{
    screen:Courses,
    navigationOptions:{
      tabBarLabel:'Courses',
      tabBarIcon:({tintColor})=>(
        <Icon name="ios-school" color={tintColor} size={24} />
      )
    }
  },
  Editor:{
    screen:Editor,
    navigationOptions:{
      tabBarLabel:'Editor',
      tabBarIcon:({tintColor})=>(
        <Icon name="ios-document" color={tintColor} size={24} />
      )
    }
  },

},{
  tabBarOptions:{
    activeTintColor:'#db0202',
    inactiveTintColor:'grey',
    style:{
      fontSize:3,
      height:45,
      backgroundColor:'white',
      borderTopWidth:0,
      elevation: 5
    }
  }
});



export default createAppContainer(TabNavigator);

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

1 Ответ

0 голосов
/ 06 июня 2019

Вам не нужно определять другой навигатор на главном экране. Если вы определяете Home как это, он должен работать:

import React from 'react'
import { Button, View } from 'react-native'

export default class Home extends React.Component {
  render() {
    const { navigation: { navigate } } = this.props
    <Button
      title='More Courses'
      onPress={() => navigate('Courses')}
    />
  }
}

Другие ваши экраны должны выглядеть примерно так.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...