如何在同一屏幕中点击不同按钮在react native中显示不同的表单

在React Native中实现在同一屏幕中点击不同按钮显示不同的表单，可以通过以下步骤：

创建一个React Native项目并配置好开发环境。
在项目中创建一个组件，命名为FormScreen.js，用于显示不同的表单。
在FormScreen.js中引入所需的React Native组件，如View、Text、TextInput等。
创建一个状态变量，用于控制显示的表单类型，命名为formType，并设置初始值为null。
根据formType的值，在render方法中判断并渲染不同的表单内容。例如，当formType为"login"时，显示登录表单；当formType为"register"时，显示注册表单。
在主页面中创建多个按钮，每个按钮分别对应不同的表单类型。通过点击按钮时，更新formType的值来切换显示的表单类型。
通过点击不同的按钮，即可在同一屏幕中显示不同的表单。

以下是一个示例代码：

// FormScreen.js

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

const FormScreen = () => {
  const [formType, setFormType] = useState(null);

  const renderForm = () => {
    if (formType === "login") {
      return (
        <View>
          <Text>Login Form</Text>
          {/* Render login form elements */}
          <TextInput placeholder="Username" />
          <TextInput placeholder="Password" secureTextEntry />
        </View>
      );
    } else if (formType === "register") {
      return (
        <View>
          <Text>Register Form</Text>
          {/* Render register form elements */}
          <TextInput placeholder="Username" />
          <TextInput placeholder="Password" secureTextEntry />
          <TextInput placeholder="Email" />
        </View>
      );
    } else {
      return <Text>Please select a form type</Text>;
    }
  };

  return (
    <View>
      <View>
        <Text>Form Types:</Text>
        <Button title="Login" onPress={() => setFormType("login")} />
        <Button title="Register" onPress={() => setFormType("register")} />
      </View>
      {renderForm()}
    </View>
  );
};

export default FormScreen;

在主页面中，可以通过导入FormScreen组件并将其作为一个页面来使用：

// App.js

import React from 'react';
import { View } from 'react-native';
import FormScreen from './FormScreen';

const App = () => {
  return (
    <View>
      <FormScreen />
    </View>
  );
};

export default App;

通过以上步骤，在React Native中实现了在同一屏幕中点击不同按钮显示不同的表单。根据实际需要，可以根据表单类型展示不同的表单内容，并通过更新状态变量来切换显示的表单类型。