Реагировать на нарушение неизменности навигации

Недавно я начал использовать React Navigation для перехода между экранами. Я застрял на ошибке и не могу идти вперед. Я не уверен, является ли это ошибкой моего проекта или мне не хватает некоторых важных вещей. Я пытался воспроизвести код из документации, но не получилось.

Вот ошибка:

Реагировать на нарушение неизменности навигации

Мой App.js:

import React from 'react';
import {View, Text, Button} from "react-navigation";
import { createAppContainer, createStackNavigator,  StackActions, NavigationActions } from 'react-navigation';

class LoginScreen 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: 'Home' })
              ],
            }))
          }}
        />
      </View>
    );
  }  
}

class HomeScreen extends React.Component {
  render(){
    return(
      <View>
        <Text>
          Home Screen
        </Text>
      </View>
    );
  }
}


const AppNavigator = createStackNavigator({
  Home: {
    screen: HomeScreen,
  },
  Login: {
    screen: LoginScreen,
  },
}, {
    initialRouteName: 'Login',
});

export default createAppContainer(AppNavigator);

Это мой index.js:

import {AppRegistry} from 'react-native';
import App from './src/App';
import {name as appName} from './app.json';


AppRegistry.registerComponent(appName, () => App);

Это мой MainActivity.java со всеми необходимыми изменениями:

package com.ggwpapplication;

import com.facebook.react.ReactActivity;
import com.facebook.react.ReactActivityDelegate;
import com.facebook.react.ReactRootView;
import com.swmansion.gesturehandler.react.RNGestureHandlerEnabledRootView;

public class MainActivity extends ReactActivity {

    /**
     * Returns the name of the main component registered from JavaScript.
     * This is used to schedule rendering of the component.
     */
    @Override
    protected String getMainComponentName() {
        return "ggWPapplication";
    }

    @Override
      protected ReactActivityDelegate createReactActivityDelegate() {
        return new ReactActivityDelegate(this, getMainComponentName()) {
          @Override
          protected ReactRootView createRootView() {
           return new RNGestureHandlerEnabledRootView(MainActivity.this);
          }
        };
     }
}

Примечание. До использования React Navigation все было в порядке.

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
50
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

у вас неправильный импорт в файле App.js:

изменять:

import {View, Text, Button} from "react-navigation";

к:

import {View, Text, Button} from "react-native";

Я чувствую себя идиотом, что скучаю по этому. Большое спасибо!

Lucas de Freitas Miranda 29.05.2019 01:29

Другие вопросы по теме