zoukankan      html  css  js  c++  java
  • use react-navigation@2.18.2

    react-native@0.59.10

    1.install

    npm install react-navigation@2.18.2

    2.in App.js

    import React from 'react';
    import { View, Text, Button } from 'react-native';
    import { createStackNavigator, StackActions, NavigationActions } from 'react-navigation'; // Version can be specified in package.json
    
    class HomeScreen extends React.Component {
      render() {
        return (
          <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
            <Text>Home Screen</Text>
            <Button
              title="Go to Details"
              onPress={() => {
                this.props.navigation.dispatch(StackActions.reset({
                  index: 0,
                  actions: [
                    NavigationActions.navigate({ routeName: 'Details' })
                  ],
                }))
              }}
            />
          </View>
        );
      }  
    }
    
    class DetailsScreen extends React.Component {
      render() {
        return (
          <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
            <Text>Details Screen</Text>
          </View>
        );
      }  
    }
    const RootStack = createStackNavigator({
      Home: {
        screen: HomeScreen,
      },
      Details: {
        screen: DetailsScreen,
      },
    }, {
        initialRouteName: 'Home',
    });
    
    export default class App extends React.Component {
      render() {
        return <RootStack />;
      }
    }
  • 相关阅读:
    var、let、const之间的区别
    es5和es6的区别
    [2020CCPC威海G] Caesar Cipher
    [CF1437E] Make It Increasing
    [CF1437C] Chef Monocarp
    [CF1436D] Bandit in a City
    [CF1418D] Trash Problem
    [CF1419E] Decryption
    [CF1420C2] Pokémon Army (hard version)
    [CF1424M] Ancient Language
  • 原文地址:https://www.cnblogs.com/dch0/p/13091735.html
Copyright © 2011-2022 走看看