将道具从 App 类传递给 const 函数 React Typescript答案

【问题标题】：Pass props from App class to const function React Typescript将道具从 App 类传递给 const 函数 React Typescript
【发布时间】：2021-06-01 16:07:46
【问题描述】：

我正在尝试使用 Expo 创建一个 React Native 应用程序。我将道具从 App 类传递到我的组件“导航器”类型 const 函数时出现逻辑错误。我不确定我必须如何传递道具，或者我必须如何在不从 App 传递的情况下访问它们：

App.tsx

import React, {useState} from 'react';
import { NavigationContainer, StackActions } from '@react-navigation/native';
import Navigator from './Components/Navigator';

export default class App extends React.Component {
  render(){
   return (
     <NavigationContainer>
       <Navigator props={this.props}/>
     </NavigationContainer>
   );
  }
}

Navigator.tsx

import React from 'react'
import { createStackNavigator } from '@react-navigation/stack'
import Login from '../Views/Login'
import Home from '../Views/Home'

const Stack = createStackNavigator();

function Navigator({props}){
  return (
           <Stack.Navigator>
              <Stack.Screen name="Login" options={{title:'Login.'}}>
                {(props) => <Login {...props} />}
              </Stack.Screen>
              <Stack.Screen name="Home" component={Home} options={{title:'Home.'}}/>
           </Stack.Navigator>
  );
}

export default Navigator;

我有错误 undefined is not an object (props)

【问题讨论】：

尽量不要破坏道具：function Navigator(props) { ...

标签： javascript typescript react-native expo

【解决方案1】：

这是因为你在进行解构

那么当你调用 props 时就像在做props.props

function Navigator(props){// remove {  } from this line

【讨论】：