0

非常感谢您提前。在标准状态下，堆栈浏览器从一个导航到 A 到页面 B，并观看或投票 Android 的返回时，它会在 A 的情况下返回到前一页面。代码是否正在运行以及发生了什么，但我是想知道如何禁用此返回，因为它发生在切换导航器中，因为它在导航 v5 中不再可用。src\routes.js

import React from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import {setNavigator} from './services/navigation';
import User from './pages/User';
import Local from './pages/Local';
import Position from './pages/Position';
import Result from './pages/Result';
import Locations from './pages/Locations';

const Stack = createStackNavigator();

export default function Routes() {
  return (
    <NavigationContainer ref={setNavigator}>
      <Stack.Navigator
        initialRouteName="User"
        screenOptions={{}}
        mode="card"
        headerMode="none">
        <Stack.Screen name="User" component={User} />
        <Stack.Screen name="Local" component={Local} />
        <Stack.Screen name="Position" component={Position} />
        <Stack.Screen name="Result" component={Result} />
        <Stack.Screen name="Locations" component={Locations} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

src\services\navigation.js

import {CommonActions} from '@react-navigation/native';

let navigator;

export function setNavigator(ref) {
  navigator = ref;
}

export function navigate(name) {
  navigator.dispatch(
    CommonActions.navigate({
      name,
    })
  );
}

环境

System:
    OS: Windows 10 10.0.18363
    CPU: (6) x64 Intel(R) Core(TM) i5-9400 CPU @ 2.90GHz
    Memory: 1.83 GB / 7.82 GB
  Binaries:
    Node: 10.19.0 - C:\Program Files\nodejs\node.EXE
    Yarn: 1.22.0 - C:\Program Files (x86)\Yarn\bin\yarn.CMD
    npm: 6.13.4 - C:\Program Files\nodejs\npm.CMD
  SDKs:
    Android SDK:
      API Levels: 28, 29
      Build Tools: 28.0.3, 29.0.3
Google Play Intel x86 Atom_64
  IDEs:
    Android Studio: Version  3.5.0.0 AI-191.8026.42.35.6010548
  npmPackages:
    react: 16.9.0 => 16.9.0
    react-native: 0.61.5 => 0.61.5

包.json

{
  "name": "bettahidroturbinas",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@react-native-community/async-storage": "^1.6.2",
    "@react-native-community/masked-view": "^0.1.6",
    "@react-navigation/native": "^5.0.3",
    "@react-navigation/stack": "^5.0.3",
    "axios": "^0.19.0",
    "eslint-config-airbnb": "^18.0.1",
    "immer": "^4.0.0",
    "prop-types": "^15.7.2",
    "react": "16.9.0",
    "react-native": "0.61.5",
    "react-native-community-geolocation": "^0.0.6",
    "react-native-geolocation-service": "^4.0.0",
    "react-native-gesture-handler": "^1.5.6",
    "react-native-masked-text": "^1.13.0",
    "react-native-reanimated": "^1.7.0",
    "react-native-safe-area-context": "^0.7.3",
    "react-native-screens": "^2.0.0-beta.2",
    "react-native-vector-icons": "^6.6.0",
    "react-redux": "^7.1.1",
    "reactotron-react-native": "^3.6.5",
    "reactotron-redux": "^3.1.1",
    "reactotron-redux-saga": "^4.2.2",
    "redux": "^4.0.4",
    "redux-saga": "^1.0.5",
    "styled-components": "^4.3.2",
    "url": "^0.11.0"
  },
  "devDependencies": {
    "@babel/core": "^7.7.5",
    "@babel/runtime": "^7.7.6",
    "@react-native-community/eslint-config": "^0.0.5",
    "babel-eslint": "^10.0.3",
    "babel-jest": "^24.9.0",
    "eslint": "^6.7.2",
    "eslint-config-airbnb": "^18.0.1",
    "eslint-config-prettier": "^6.3.0",
    "eslint-plugin-import": "^2.18.2",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-prettier": "^3.1.0",
    "eslint-plugin-react": "^7.14.3",
    "eslint-plugin-react-hooks": "^2.0.1",
    "jest": "^24.9.0",
    "metro-react-native-babel-preset": "^0.57.0",
    "prettier": "^1.18.2",
    "react-test-renderer": "16.9.0"
  },
  "jest": {
    "preset": "react-native"
  }
}

提前感谢您的答案。

4

2 回答 2

1

代替navigate，您可以使用replace替换屏幕，以便删除前一个屏幕。这将类似于navigateswitch navigator 中的工作方式。

https://reactnavigation.org/docs/en/stack-actions.html#replace

于 2020-02-13T19:26:12.923 回答
0

@satya164 src\routes.js 提出的解决方案

import React from 'react';
import {NavigationContainer} from '@react-navigation/native';
import {createStackNavigator} from '@react-navigation/stack';
import {setNavigator} from './services/navigation';
import User from './pages/User';
import Local from './pages/Local';
import Position from './pages/Position';
import Result from './pages/Result';
import Locations from './pages/Locations';

const Stack = createStackNavigator();

export default function Routes() {
  return (
    <NavigationContainer ref={setNavigator}>
      <Stack.Navigator
        initialRouteName="User"
        screenOptions={{}}
        mode="card"
        headerMode="none">
        <Stack.Screen name="User" component={User} />
        <Stack.Screen name="Local" component={Local} />
        <Stack.Screen name="Position" component={Position} />
        <Stack.Screen name="Result" component={Result} />
        <Stack.Screen name="Locations" component={Locations} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

src\services\navigation.js

import {CommonActions, StackActions} from '@react-navigation/native';

let navigator;

export function setNavigator(ref) {
  navigator = ref;
}

export function navigate(name) {
  navigator.dispatch(
    CommonActions.navigate({
      name,
    })
  );
}
export function replace(name) {
  navigator.dispatch(StackActions.replace(name));
}
于 2020-02-13T19:50:34.463 回答