非常感谢您阅读本文 我目前在我的本机项目中遇到问题 老实说,我怀疑问题是由React导航器引起的 请帮助我解决此问题,我必须查看App.tsx中的代码段 我对本机做出了新的反应,我对react stack navigator遇到了问题 我强烈怀疑问题出在resultScreen.tsx
---------
The action 'NAVIGATE' with payload {"name":"Result","params":{"searchText":"Jane"}} was not handled by any navigator.
Do you have a screen named 'Result'?
If you're trying to navigate to a screen in a nested navigator, see https://reactnavigation.org/docs/nesting-navigators#navigating-to-a-screen-in-a-nested-navigator.
This is a development-only warning and won't be shown in production.
* [native code]:null in __expoConsoleLog
- node_modules/react-native/Libraries/LogBox/LogBox.js:33:4 in console.error
- node_modules/expo/build/environment/muteWarnings.fx.js:27:4 in error
- node_modules/@react-navigation/core/src/BaseNavigationContainer.tsx:380:13 in React.useCallback$argument_0
- node_modules/@react-navigation/core/src/useNavigationHelpers.tsx:46:20 in dispatch
- node_modules/@react-navigation/core/src/useNavigationCache.tsx:77:12 in dispatch
- node_modules/@react-navigation/core/src/useNavigationCache.tsx:89:24 in acc.name
* src/screens/SearchScreen.tsx:42:21 in TouchableHighlight.props.onPress
- node_modules/react-native/Libraries/Components/Touchable/TouchableHighlight.js:209:10 in Pressability$argument_0.onPress
- node_modules/react-native/Libraries/Pressability/Pressability.js:655:17 in _performTransitionSideEffects
- node_modules/react-native/Libraries/Pressability/Pressability.js:589:6 in _receiveSignal
- node_modules/react-native/Libraries/Pressability/Pressability.js:499:8 in responderEventHandlers.onResponderRelease
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:286:4 in invokeGuardedCallbackImpl
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:497:2 in invokeGuardedCallback
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:521:2 in invokeGuardedCallbackAndCatchFirstError
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:683:41 in executeDispatch
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:707:19 in executeDispatchesInOrder
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:872:28 in executeDispatchesAndRelease
* [native code]:null in forEach
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:851:4 in forEachAccumulated
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:897:20 in runEventsInBatch
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:1069:18 in runExtractedPluginEventsInBatch
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2835:35 in batchedUpdates$argument_0
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:20569:13 in batchedUpdates$1
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2731:29 in batchedUpdates
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2834:16 in _receiveRootNodeIDEvent
- node_modules/react-native/Libraries/Renderer/implementations/ReactNativeRenderer-dev.js:2911:27 in receiveTouches
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:425:19 in __callFunction
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:112:6 in __guard$argument_0
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:373:10 in __guard
- node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:111:4 in callFunctionReturnFlushedQueue
* [native code]:null in callFunctionReturnFlushedQueue
请参阅上面的堆栈跟踪
//App.tsx
//------------------
export default function App() {
return (
<NavigationContainer>
<Stack.Navigator>
<Stack.Screen
name="Home"
component={SearchScreen}
options={{
title: "Welcome",
headerStyle: {
backgroundColor: "#f4511e" //Set Header color
},
headerTintColor: "#fff", //Set Header text color
headerTitleStyle: {
fontWeight: "bold" //Set Header text style
}
}}
/>
<Stack.Screen name="Result" component={ResultScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}
//SearchScreen.tsx
//------------------
import React, { Component } from "react";
import Database from "../src/components/Database";
import {
StyleSheet,
PixelRatio,
Image,
KeyboardAvoidingView,
TouchableHighlight,
TextInput,
Button,
Alert,
Text,
View
} from "react-native";
import { NavigationContainer } from "@react-navigation/native";
import { createStackNavigator } from "@react-navigation/stack";
class SearchScreen extends Component {
render() {
return (
<View
style={{
flex: 1
}}
>
<KeyboardAvoidingView
behavior={Platform.OS == "ios" ? "padding" : "height"}
style={styles.container}
>
<View style={styles.picContainer}>
<Image source={require("./main_logo.png")} style={styles.logo} />
</View>
<View style={styles.fieldContainer}>
<TextInput
placeholder="Ente Search Text"
spellCheck={false}
name="myTitle"
/>
</View>
<View style={styles.fieldContainer}>
<TouchableHighlight
onPress={() =>
this.props.navigation.navigate("Result", { searchText: "Jane" })
}
style={styles.button}
>
<Text style={styles.buttonText}>SEARCH</Text>
</TouchableHighlight>
</View>
</KeyboardAvoidingView>
</View>
);
}
}
export default SearchScreen;
//ResultScreen.tsx
//------------------
import React, { Component } from "react";
import Database from "../src/components/Database";
import {
StyleSheet,
PixelRatio,
Image,
KeyboardAvoidingView,
TouchableHighlight,
TextInput,
Button,
Alert,
Text,
View
} from "react-native";
import { NavigationContainer } from "@react-navigation/native";
import { createStackNavigator } from "@react-navigation/stack";
class ResultScreen extends Component {
render() {
return (
<View>
<View>
<TouchableHighlight style={styles.button}>
<Text>GO BACK</Text>
</TouchableHighlight>
</View>
</View>
);
}
}
export default ResultScreen;