Как вы переходите на следующую страницу, используя реквизит в реагировать родной?

Question

Мой текущий код

Приложение. js

import React from 'react';
import { View } from 'native-base';
import 'react-native-gesture-handler';
import { TouchableOpacity } from 'react-native';

export default class All extends React.Component {
  constructor(props) {
    super(props);
    this.state = { };
  }

  render() {
    return (
      <TouchableOpacity onPress=>{ this.props.navigation.navigate('SellHowto') }>
        <Text>submit</Text>
      </TouchableOpacity>
    );
  }
}

AuthenticationNavigator. js

import { createSwitchNavigator, createAppContainer } from 'react-navigation';
import TabNavigator from 'app/src/navigations/TabNavigator';
import LoadingScreen from 'app/src/screens/authentication/Loading';
import SellHowtoScreen from 'app/src/screens/sell/Howto';

const AuthenticationNavigator = createAppContainer(
  createSwitchNavigator(
    {
      Loading: { screen: LoadingScreen },
      SellHowto: { screen: SellHowtoScreen },
    },
    {
      initialRouteName: 'Loading',
    },
  ),
);

export default AuthenticationNavigator;

TabNavigator. js

import React from 'react';
import { Image } from 'react-native';
import { createAppContainer } from 'react-navigation';
import { createBottomTabNavigator } from 'react-navigation-tabs';
import HomeScreen from 'app/src/screens/home/Index';
import SellScreen from 'app/src/screens/sell/Index';

const BottomTabNavigatorConfig = {
  initialRouteName: 'Home',
  tabBarOptions: { showLabel: true },
};
const TabNavigator = createAppContainer(
  createBottomTabNavigator(
    {
      Home: {
        screen: HomeScreen,
        navigationOptions: {
          title: 'Home',
        },
      },
      Sell: {
        screen: SellScreen,
        navigationOptions: {
          title: 'Sell',
        },
      },
    },
    BottomTabNavigatorConfig,
  ),
);

export default TabNavigator;

продажа / индекс. js

import React from 'react';
import 'react-native-gesture-handler';
import ScrollableTabView from 'react-native-scrollable-tab-view';
import All from 'app/src/screens/sell/All';

export default class Index extends React.Component {
  render() {
    return (
      <ScrollableTabView style={{ marginTop: 30, flex: 1 }}>
        <All tabLabel="all"/>
      </ScrollableTabView>
    );
  }
}

продажа / Все. js

import React from 'react';
import { View } from 'native-base';
import 'react-native-gesture-handler';
import { TouchableOpacity } from 'react-native';

export default class All extends React.Component {
  constructor(props) {
    super(props);
    this.state = { };
  }

  render() {
    return (
      <TouchableOpacity onPress=>{ this.props.navigation.navigate('SellHowto') }>
        <Text>submit</Text>
      </TouchableOpacity>
    );
  }
}

Проблема, с которой я сталкиваюсь, заключается в том, что я не могу go продать страницу страницы со страницы продажи / все. js. Кроме того, я получил еще две страницы после страницы SellHowto. Я был бы признателен, если бы вы могли рассказать мне, как сохранить состояние на следующей странице, предоставив реквизиты. Заранее спасибо:)

Answer 1

, если вы пытаетесь перейти от компонента, который является прямым потомком маршрутизатора, у которого есть доступная навигационная опора, и вы можете использовать this.props.navigation.navigate(<route>) для навигации. Если компонент не является прямым потомком маршрутизатора, вы можете обернуть его внутри withNavigation ho c, предоставленного реагирующей навигацией, и он развернет навигационную опору для вашего компонента, а затем снова вы сможете использовать его так же, как указано выше