React Native组件篇 ，前端界面开发基础

在React Native中创建一个简单的登录界面可以使用以下代码：

import React, { useState } from 'react';
import { View, Text, TextInput, Button } from 'react-native';
 
const LoginScreen = () => {
  const [username, setUsername] = useState('');
  const [password, setPassword] = useState('');
 
  const handleLogin = () => {
    // 在这里添加登录逻辑
    console.log('Login with:', username, password);
  };
 
  return (
    <View>
      <TextInput
        placeholder="Username"
        value={username}
        onChangeText={setUsername}
      />
      <TextInput
        placeholder="Password"
        secureTextEntry={true} // 密码输入框
        value={password}
        onChangeText={setPassword}
      />
      <Button onPress={handleLogin} title="Login" />
    </View>
  );
};
 
export default LoginScreen;

这段代码展示了如何使用React Native创建一个简单的登录界面，包括用户名和密码输入框以及一个登录按钮。它使用了Hooks (useState) 来管理输入状态，并在按钮点击时触发登录函数。在实际应用中，你需要替换handleLogin函数中的逻辑以连接后端服务进行身份验证。