如何在 react-native 中使用自定义功能组件？

Question

如何在 React Native 中使用功能自定义组件？？？我实际上构建了一个登录功能组件，如自定义反应但不存在“div”我做了一个“视图” 为什么这不起作用？？

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

    const Login = () => {
    return (
        <View>
          <Text>Hi</Text>
        </View>
      );
    }
    export default Login;

--------------------------------- 
    import React from 'react';
    import {Login} from './components/Login/Login';
    import { Text, View } from 'react-native';
    
    const App = () => {
        return (
        <View>
          <Login/>
       </View>
        )
     }
     export default App;

Answer 1

你的 named exports and default exports 转好了。

这会起作用：

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

    const Login = () => {
    return (
        <View>
          <Text>Hi</Text>
        </View>
      );
    }
    export default Login;

--------------------------------- 
    import React from 'react';
    import Login from './components/Login/Login';
    import { Text, View } from 'react-native';
    
    const App = () => {
        return (
        <View>
          <Login/>
       </View>
        )
     }
     export default App;

当您 export default Login 时，您必须使用 import Login from './components/Login/Login'

将其导入为默认导入

Here is an Expo Snack with the working code as well