如何解决错误“预期类型来自在类型上声明的属性'组件'”？答案

【问题标题】：How can I resolve the error "the expected type comes from property 'component' which is declared here on type"?如何解决错误“预期类型来自在类型上声明的属性'组件'”？
【发布时间】：2021-08-10 03:09:01
【问题描述】：

在我的代码中，我正在尝试创建一个 Stack Navigator。

这是我制作的堆栈导航器。

import React from 'react';
import { View, Text, StyleSheet } from 'react-native';
import { createStackNavigator } from '@react-navigation/stack';

import EnterPassword from '../screens/EnterPassword';
import EnterAccount from '../screens/EnterAccount';

const GoogleLoginStack = createStackNavigator();

const GoogleLogin = () => {
    return (
        <GoogleLoginStack.Navigator>
            <GoogleLoginStack.Screen name='EnterAccount' component={EnterAccount} />
            <GoogleLoginStack.Screen name='EnterPassword' component={EnterPassword} />
        </GoogleLoginStack.Navigator>
    )
};


export default GoogleLogin;

然后在 App.tsx 文件中使用：

...
<Stack.Screen name="Login" component={Login} />
<GoogleLogin />
<Stack.Screen name="SignUp" component={SignUp} />
...

我创建的画面如下：

import React from 'react';
import { View, Text, StyleSheet } from 'react-native';

const EnterAccount = (props: any) =>  {
    <View style={styles.screen}>
        <Text>
            Enter Account Screen
        </Text>
    </View>
}

const styles = StyleSheet.create({
    screen: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
    }
})

export default EnterAccount;

但是，我收到此错误：错误文字：https://i.stack.imgur.com/zKbAa.png

我知道这是因为我如何定义道具的类型，但我不确定定义道具类型的正确方法是什么。

非常感谢您的帮助！

【问题讨论】：

标签： typescript react-native

【解决方案1】：

您没有返回输入帐户组件的 JSX，这就是您收到错误的原因，请在该组件中添加 return 语句

import React from 'react';
import { View, Text, StyleSheet } from 'react-native';

const EnterAccount = (props: any) =>  {
  return (
    <View style={styles.screen}>
        <Text>
            Enter Account Screen
        </Text>
    </View>
  )
}

const styles = StyleSheet.create({
    screen: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
    }
})

export default EnterAccount;

【讨论】：