向组件添加navigation.navigate时出现“错误:未定义的不是对象”？
这个错误通常是由于在使用React Navigation库时，未正确引入或配置导航组件所导致的。为了解决这个问题，你可以按照以下步骤进行排查和修复：
- 确保已正确安装和配置React Navigation库。你可以参考React Navigation的官方文档（https://reactnavigation.org/）来了解如何正确安装和配置该库。
- 确保你的导航组件已正确引入。在使用navigation.navigate时，你需要确保已正确引入导航组件，并且该组件已正确配置和注册。
- 检查导航组件的命名是否正确。确保你在使用navigation.navigate时，传入的导航组件名称与实际导航组件的名称一致。
- 检查导航组件是否在正确的上下文中使用。有时候，当导航组件被放置在错误的上下文中时，会导致该错误的出现。确保你在正确的组件中使用导航组件，并且导航组件的上下文正确。
- 检查导航组件的参数是否正确。有时候，当你在使用navigation.navigate时，传入的参数不正确或缺失时，也会导致该错误的出现。确保你在使用navigation.navigate时，传入正确的参数。
总结：当出现“错误:未定义的不是对象”时，通常是由于未正确引入或配置导航组件所导致的。你可以按照上述步骤进行排查和修复。如果问题仍然存在，可以提供更多的代码和错误信息，以便更好地帮助你解决问题。
相关·内容
import React from 'react';
import {Button, View, Text} from 'react-native';
const RegistrationScreen = (navigation: any) => {
return (
<View>
<Text>My Registration Page</Text>
<Button
title="Go Back"
onPress={() =>
浏览 0提问于2020-10-10得票数 1
回答已采纳
我正在使用导航来导航我的react原生应用程序，但我无法通过这个问题。我按照文档做了，但对我来说什么都不起作用。
问题是，我试图使用导航选项来添加标题和右键，以将我导航到另一个屏幕，但它总是给我这个错误："navigation.navigate不是一个函数。(在navigation.navigate中是未定义的)“
下面是我的代码：
static navigationOptions = (navigation) => {
return {
title: 'Review Jobs',
heade
浏览 0提问于2018-10-20得票数 5
回答已采纳
我正试图作为初学者的项目来完成这个任务，但是我一直都会遇到错误：navigation.navigate不是一个函数。(在'navigation.navigate (‘食谱’)，‘navigation.navigate是未定义的’，我只是尝试导航到一个页面时，我点击按钮，但我不断得到错误。我试着浏览文档和控制台日志‘导航’，但它只是说未定义。
这是我的app.js
import { createAppContainer } from 'react-navigation';
import { createStackNavigator } from 'react-na
浏览 2提问于2020-10-14得票数 0
enter image description here使用导航v5时，遇到错误can not read property navigate of undefined const导航({Categories=})=>{ return (
<View >
<Text style={Styles.TextCategories}>دسته بندی ها</Text>
{/* ---------------------------------------------------------------
浏览 44提问于2020-11-02得票数 1
下面是我创建的导航容器： <NavigationContainer>
<Stack.Navigator
screenOptions={{
headerShown: false
}}
>
<Stack.Screen name="Home" component={HomeScreen} />
<Stack.Screen name="Music" component={MusicScreen
浏览 13提问于2020-09-23得票数 0
如何使用标题上的按钮在屏幕之间导航？当我尝试返回或使用标题按钮导航到其他页面时，我得到了相同的错误。屏幕上的按钮工作正常。 “未定义不是对象(计算'navigation.navigate') (设备)” “未定义不是对象(计算'navigation.goBack')” import 'react-native-gesture-handler';
import React from 'react';
import { Text, View, StyleSheet, Button } from 'react-native&
浏览 6提问于2020-10-04得票数 0
回答已采纳
这是“控制”导航的btn。
它加载第一个堆栈Home，但是当我按下可触摸的不透明度去QnScreen时，它会抛出一个错误:未定义不是一个对象(计算'navigation.navigate')。
我试过了，我陷入了抑郁的深渊。
import * as React from 'react';
import { LinearGradient } from "expo-linear-gradient";
import { StyleSheet, Text, TouchableOpacity, Image } from "react-native&
浏览 8提问于2022-07-21得票数 -7
我在react导航中遇到了一个问题，错误消息“未定义的不是一个对象(计算'navigation.navigate')”。尝试通过另一个路由上的按钮调用屏幕时出错
组件代码：
export default function Estruturas({ title, display, navigation }) {
const [estruturas, setEstruturas] = useState([]);
useEffect(() => {
async function loadEstruturas() {
浏览 0提问于2020-07-08得票数 0
问题是，我试图使用导航选项来添加标题和右键，以将我导航到另一个屏幕，但它总是给我这个错误："navigation.navigate不是一个函数。(在navigation.navigate中是未定义的)“
下面是我的代码：
import 'react-native-gesture-handler';
import * as React from 'react';
import{View,Text, Button} from 'react-native'
import { NavigationContainer } from '@r
浏览 7提问于2021-05-23得票数 0
const ResolvedPlaces = ({navigation}) => {
return(
<View style={Styles.headerWrapper}>
<TouchableOpacity navigation={navigation} onPress={()=> navigation.navigate("ProfileScreen")} >
<Text style={[Styles.header,{fontWeight:"bold"
浏览 15提问于2022-04-16得票数 0
回答已采纳
这里有直接来自react导航链接文档的代码。
import * as React from 'react';
import { Button } from 'react-native';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
const Stack = createNativeStackN
浏览 6提问于2022-03-04得票数 0
我在反应本土化方面是很新的，而且我正在收到这个错误。请帮忙！navigation.navigate is not a function. (In 'navigation.navigate("HomeScreen")', 'navigation.navigate' is undefined)
import { View, Text,Button,StyleSheet, TouchableOpacity } from 'react-native'
import React, {useState} from 'react'
浏览 4提问于2022-05-04得票数 0
回答已采纳
我试图设置一个单元测试如下：
import Vue from 'vue'
import ChangeTitleComponent from '@/components/ChangeTitleComponent'
import store from '@/vuex/store'
describe('ChangeTitleComponent.vue', () => {
describe('changeTitle', () => {
var com
浏览 2提问于2017-09-17得票数 0
回答已采纳
我有这个问题的反应本机，反应导航，即使有这个错误导航流仍然工作。
类型' string‘的参数不能分配给类型'{ key: string；params?：undefined；merge?：boolean；}{ name: not；key?：string\未定义；params: not；merge?：boolean；}'.ts(2345)
export function LoginContainer() {
const navigation = useNavigation()
async function handleSignInEmail() {
浏览 15提问于2022-01-18得票数 0
我已经创建了一个带有标题按钮的堆栈导航器，该按钮将用于导航到另一个屏幕，但是当我尝试转到另一个屏幕时，会出现此错误。
TypeError:未定义不是对象(计算'navigation.navigate')
当我console.log(navigation)它的未定义。但是，当我在组件中创建一个按钮&导航到另一个屏幕时，它可以工作。只有标题按钮才会给我带来问题。
import {createStackNavigator} from '@react-navigation/stack';
import TabNav from './TabNavBar
浏览 4提问于2020-07-06得票数 0
回答已采纳
1回答
我正在熟悉新的反应导航版本。在使用navigation.navigate方法时，我看到了一个问题。
当前行为
当我们单击菜单按钮时，它会抛出一个错误设备：(65:24)未定义的不是一个对象(计算'navigation.navigate')期望的行为。
点击菜单按钮，它应该打开抽屉如何复制。
浏览 2提问于2020-04-10得票数 0
回答已采纳
1回答
在react-native中，是否可以使用不同的参数导航相同的路线？当我尝试它的时候，它总是给我一个错误，告诉我参数是未定义的。下面是我的代码： function Home({ route, navigation }){
const { newText } = route.params;
return (
<View style={styles.container}>
<Text style={{fontSize:30, paddingVertical:150, fontWeight:'bold'}}>Current Balance: {JSON.
浏览 12提问于2021-11-19得票数 0
回答已采纳
1回答
我是一个新的反应本机，我想打开另一个屏幕时，按钮被点击，我想显示的屏幕已经创建。我使用TouchableOpacity作为我的按钮，并使用"onPress“道具上的导航。我的应用程序已经使用了Stack导航器和Tab导航器，所以我已经安装了这些软件包。
我试过了，但是我得到了一个错误"undefined is not an object (evaluating 'navigation.navigate')“
请帮帮忙。
在我显示按钮的屏幕上：
const myWebview = ({ navigation }) => {
return (
浏览 2提问于2022-05-10得票数 0
回答已采纳
我得到了TypeError:未定义在React Native中不是一个对象(计算‘navigation.state’)。
const DashboardFooter = ({navigation}) => {
const activePage = navigation.state.index;
return (
<TouchableOpacity
style={styles.tabIconContainer}
onPress={() => navigation.navigate(&#
浏览 16提问于2020-05-14得票数 0
回答已采纳
2回答
我是新来的反应本地人/点燃弓箭手。我正在做一个反应本土/点燃投球手项目。
在我的应用程序中，首先有一个欢迎屏幕，它会在应用程序启动时出现。欢迎屏幕上有一个“继续”按钮。当我单击“继续”按钮时，它应该会转到登录屏幕。但是它显示了这个错误：
TypeError: undefined is not an object (evaluating 'navigation.navigate')
我正在一个实际的实体android设备上运行这个应用程序。
有谁可以帮我？这是我在github的代码：
https://github.com/boidurja/smartcope_new.git
这是
浏览 5提问于2020-03-27得票数 0
回答已采纳
我正在尝试用一个AuthContext和useContext钩子实现用户登录。如果用户已登录，我想在抽屉中显示用户名。但是，当我尝试访问CustomDrawerContent功能组件中的useContext时，出现了以下错误。 错误： ? //App.JsCodes export default function App() {
const [user,setUser] = useState();
const Drawer = createDrawerNavigator();
return (
<AuthContext.Provider value={{us
浏览 5提问于2021-07-05得票数 1
回答已采纳
1回答
使用onError呈现函数
、、、、
我有一个对象，我想在运行grapqhl查询(在阿波罗的onError上)时出现错误时呈现它： export const ErrorContainer: React.FunctionComponent = () => {
console.log('container running')
return (
<View style={styles.errorView}>
<Text style={styles.errorText}>Unable to Load Friends</Text>
</View&g
浏览 16提问于2020-06-30得票数 0
回答已采纳
我有个问题，在反应上-本地人。
<Button title="Save" onPress = {() => navigation.navigate('Save' , { image })}/>
{image && <Image source = {{uri: image}} style= {{flex: 1}}/>}
</View>
);
}
我有个错误：
navigation.navigate is not a function. (In 'navigation.naviga
浏览 3提问于2021-01-16得票数 1
回答已采纳
1回答
我添加了几个标题右边的按钮，但当我单击它们时，我得到以下错误： TypeError: undefined is not an object (evaluating '_this.props.navigation.navigate') 这是标题的代码，它有标题的右按钮： <Stack.Screen
name="Tabs"
component={Tabs}
options = {{
title: " ",
head
浏览 13提问于2021-01-19得票数 0
回答已采纳
我正在尝试显示一个TouchableOpacity列表，以便使用navigation.navigate(.)导航到另一个页面。
我使用map显示列表，但我无法导航，onPress无法处理以下错误消息：“未定义不是对象(计算'navigation.navigate')
我做错什么了？
function PopupMenuAction ({navigation}) {
return (
<>
<TouchableOpacity style={style.shape1to2} onPress={() => resi
浏览 3提问于2022-11-11得票数 0
回答已采纳
我得到了这个错误。看来这个承诺还没有得到解决。但是，我不知道怎么解决这个问题.我正在使用异步存储
错误：
对象作为React子对象无效(找到:带有键{_40、_65、_55、_72}的对象)。
这是我的密码
const ProfileStackScreen = ({navigation}) => {
return (<ProfileStack.Navigator>
<ProfileStack.Screen name= {"Profile"} component={Profile}
options ={{
title
浏览 1提问于2020-04-14得票数 0
回答已采纳
，我现在能解决我的问题了，多亏了斯蒂芬-答案
我对导航在React原生中的工作方式有一点疑问。
基本上，我想做的是:\
当我在主堆栈中时，从在Home中调用的Feed函数导航到SubFeed堆栈。
这是我的密码
import Feed from './Feed'
function Home({ navigation }) {
return (
<ScrollView>
<Feed/>
</ScrollView>
Home.js
function Feed({ navigation }) {
return
浏览 2提问于2021-10-27得票数 0
回答已采纳
我刚开始对本机做出反应，并试图在react本机stackNavigators中将两个drawerNavigator包含到一个drawerNavigator中。下面也给出了我的Navigator代码。
当我将两个stackNavigator都添加到drawerNavigator中时，它会显示错误：
在v4教程视频中，有一些将stackNavigator添加到drawerNavigator中的实例，但却找不到对v5的任何帮助。对v5有帮助吗？
ShopNavigator.js
import React from 'react';
import { createStac
浏览 4提问于2020-06-30得票数 0
回答已采纳
1回答
在反应导航6中，如何解决“未定义不是评估navigation.navigate的对象”的错误？
const CategoryContainer = ({
setSelectedItem,
navigation,
}: {
setSelectedItem: Function;
navigation: any;
}) => {
return (
<TouchableOpacity onPress={() => navigation.navigate('Filter')}>
<Image
style=
浏览 4提问于2022-10-05得票数 0
我正在用onPress在TouchaleOpacity上导航到名为'Infocli‘的屏幕，但这不是工作...(onPress={() => navigation.navigate('Infocli')})错误TypeError:未定义不是对象(计算'navigation.navigate') App.js import React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { creat
浏览 19提问于2021-08-13得票数 0
回答已采纳
当用户单击平面列表中的项时，我想导航到另一个屏幕，但始终得到相同的错误。
TypeError: undefined is not an object (evaluating 'navigation.navigate')
我在snack.expo上创建了一个项目，尝试在屏幕之间移动，它可以工作。这是链接
但是每当我试图在我的项目上实现时，我都会得到同样的错误。需要帮助。
AuditList.js // Child Component
const AuditList = ({navigation}) => {
const [selectedId, setSelected
浏览 5提问于2021-02-02得票数 0
回答已采纳
1回答
有人知道tabBarOnPress在中有一个很好的替代方案吗？当用户按下tabIcon (即取消其默认导航行为)时，我想导航到模态堆栈，但是图标似乎首先导航到Tab屏幕，然后导航到模式。
为了澄清，下面是我的PostIcon TabIcon组件
export const PostStackIcon: React.FC<TabBarIconProps> = ({ size, color }) => {
const navigation = useNavigation();
const goToCreatePost = () => {
na
浏览 3提问于2020-03-19得票数 1
回答已采纳
因此，我试图将一些属性传递给另一个屏幕，在react中使用本机(带expo)，并出现以下错误:错误“未定义不是一个对象(计算'this.route')”，每个time.Im使用路由参数传递在道具标签"Jane“中指定的文本。我使用过其他变体，但总是出现同样的错误。
我的代码是
屏幕1：
export default function HomeScreen({ navigation }) {
const [author, setAuthor] = useState([]);
return (
<View style={styles.containe
浏览 2提问于2021-01-02得票数 0
每当我在另一个组件中放置一个具有导航功能的组件时，我总是会得到标题中的错误。
通过导航传入的组件：
import React from 'react'
import { View, Text, Pressable, StyleSheet } from 'react-native'
import Ionicons from 'react-native-vector-icons/Ionicons'
const SearchBar = ({navigation}) => {
return (
<Pressable
浏览 2提问于2021-11-26得票数 0
我正在努力学习反应本土化，但却出现了以下错误
ReferenceError:导航未定义
我是初学者，请你指导我解决这个错误。
我也试图更改为功能组件，但得到了同样的错误。
我正在使用世博会作为学习的目的。
import 'react-native-gesture-handler';
import React, { Component } from "react";
import { ActivityIndicator, StyleSheet, Text, View, Image, Button,ImageBackground } from "react
浏览 1提问于2021-05-05得票数 0
回答已采纳
有谁能向我解释一下为什么当我运行这段代码时会出现以下错误: App.js:11 Uncaught : handleClick未定义.
但是当我把它改为下面的代码时，它起作用了，
浏览 9提问于2022-07-09得票数 -1
回答已采纳
(在“navigation.navigate(”Home“)”中，“navigation.navigate”未定义)
const handleLogin = () => {
auth
.signInWithEmailAndPassword(email, password)
.then((userCredentials) => {
const user = userCredentials.user;
console.log("Logged in with:", user.email);
浏览 4提问于2022-08-22得票数 0
回答已采纳
2回答
我有一个(可能)非常简单的问题：
我试图在按钮Logout一按下就调用函数handleRequest，但我得到的错误是未定义的对象不是对象。我认为，我需要重新安排功能，但我不确定如何，因为我是新的反应本地人。
希望有人能帮我。
最棒的纳德
import { Text, StyleSheet, View, Button } from 'react-native'
import React from 'react'
const HomeScreen = ({ navigation }) => {
return <View>
浏览 3提问于2020-12-08得票数 1
回答已采纳
我应该在哪里添加导航？在函数Get Header和Render项不工作，并且不能移动到下一个屏幕，在堆栈导航器中一切正常，问题正如我在平面列表中所认为的那样，必须分类错误
如何解决此问题？undefined不是对象(计算“navigation.navigate”)
或
无法找到变量:导航
从React导入react；从react- FlatList导入{ View，Text，StyleSheet }；
const DATA = [
{ id: '1', day: '28' },
{ id: '1', day: '28
浏览 28提问于2021-03-08得票数 0
2回答
我正在使用。我只尝试将我的一个屏幕输入到mode="Modal中，但是当导航时我所通过的路由参数正在与错误的TypeError: undefined is not an object (evaluating 'route.params.title')“未定义”。这是为什么，我怎么能解决这个问题？
我的尝试
const ModalScreen = () => (
<Modals.Navigator mode="modal">
<Modals.Screen
name="Modal"
浏览 2提问于2020-07-24得票数 2
下面的代码显示了该特定教程的应用程序的主屏幕。我的问题是:他们这样做而不使用类有什么原因吗？另外，这很重要吗？你使用const而不是class有什么特别的原因吗？
const HomeScreen = ({ navigation }) => {
return (
<View>
<Text style={styles.textStyle}>This is the Home Screen</Text>
<Button title="Go to Components Demo"
浏览 0提问于2019-09-03得票数 9
无法导航到新的本机react屏幕，出现错误：
TypeError:未定义不是对象(计算“”navigation.navigate“”)
有人能解释一下我哪里出错了吗？下面是我使用的代码。
const MessagesScreen = ({navigation}) => {
return (
<Container>
<FlatList
data={Messages}
keyExtractor={item=>item.id}
浏览 6提问于2021-06-09得票数 0
回答已采纳
我对整个编码工作都是新手，现在我终于遇到了第一个无法解决的与代码相关的迷思！我的问题是，我根本找不到一种方法来使用FlatList，使我有可能导航到另一个屏幕！(我正在使用Stack screen，我的8个项目的长FlatList中的每一项都链接到另一个屏幕，或者至少我试图做到这一点)以下是包含FlatList的我的屏幕的代码： import React, { Component } from 'react';
import {
FlatList,
StyleSheet, Text,
View
} from 'react-native'
浏览 26提问于2020-12-21得票数 2
回答已采纳
我正在学习JavaScript、React Native和React导航。我刚刚学到了解构。这很棒，除了我看不到只有一个参数时的意义。例如，为什么不直接写 function HomeScreen( navigation ) { /* same code as below */ 而不是 function HomeScreen({ navigation }) {
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
浏览 36提问于2020-04-15得票数 0
我在公路上设置了平行线。它们从我的组件出现在控制台中，但我得到了一个“未定义”的错误。
<Router>
<App>
<Switch>
<Route exact path='/data/:param' component={data} />
</Switch>
</App>
</Router>
组件
class Data extends Component {
constructor(pro
浏览 1提问于2020-03-08得票数 0
回答已采纳
1回答
当在Login.js中按下登录按钮时，我试图导航到主屏幕。LoginForm非常完美地加载，但是当我按下按钮时，我开始收到错误"TypeError: Undefined不是一个对象“(计算'navigation.navigate')。在此之前，这不是一个问题，但是当我将登录移到另一个组件时，它发生了变化。我得到了一个不同的错误，我经历了这个错误，但它没有修复它:如果需要完整的代码，会告诉我。谢谢:)
LoginForm.js
...
import Login from "./Login";
const LoginForm = props => {
浏览 1提问于2020-01-14得票数 0
我在我的反应-本土项目有一个错误，我使用类型记录和博览会。因此，当我使用useEffect()获取FlatList的api响应时，我会收到以下错误：
我的代码：
import React, { useEffect, useState } from 'react';
import {
Image,
Text,
View,
SafeAreaView,
FlatList
} from "react-native";
import { useNavigation } from '@react-navigation/native';
i
浏览 0提问于2020-12-20得票数 0
我有一个父组件，它在componentDidMount()钩子中获取数据。状态为setState()-d与此数据。然后，我将数据作为道具传递给子组件，并根据这些道具设置它们的状态。在第一次呈现时，由于componentDidMount()尚未执行，所以道具将未定义。因此，子组件得到未定义的道具，并使用它们创建状态。当componentDidMount()中的数据获取时，新的道具被传递给子组件，但是状态已经用未定义的道具创建，没有任何改变。因此，我现在知道两种解决办法：
使用componentWillRecieveProps().但这一点现在已不受欢迎。
使用无状态子组件。将数据
浏览 2提问于2018-11-14得票数 0
我们使用带有实体框架的breeze.js来启动客户端实体管理。
我们随机得到“未能在‘DOMStringMap’上设置‘$visited’属性：‘data-$ set’不是一个有效的属性名”，错误的breeze.js从它的__toJSONSafe方法。
有谁知道什么会使"obj._$visited“属性不被定义？它是以未定义的形式出现的，这将导致调用saveChanges()时出现问题。
浏览 1提问于2015-06-16得票数 0
因此，我一直遵循教程，并适应我的需要。
我检查了另一个答案，但不太清楚我错过了什么？
对于搜索引擎，错误是:未定义的不是对象、路由器、getStateForAction。
App.js
import React, {Component} from 'react';
import {createStore, combineReducers, applyMiddleware} from 'redux'
import {Provider, connect} from 'react-redux'
import reducers from
浏览 1提问于2017-09-28得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
