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

我试着用谷歌搜索我的问题，它只显示js文件和代码。我想在按下按钮时显示一个东西，但它没有显示。我希望它被返回，即使它在那里也不会使项目不可见。我想在同一屏幕中弹出，就像单击按钮一个窗体，单击另一个窗体时弹出不同的窗体

import React, { Component } from 'react';
import {
  StyleSheet,
  Text,StatusBar,
  View,Button,Image,
  TouchableOpacity,
  Alert
} from 'react-native';
class App extends Component {
  constructor(props) {
    super(props);
    //this.sayHello = this.sayHello.bind(this);
  }
 sayHello=() => {
    return(
      <View>
    {/* //<Text>hello</Text> */}
    Alert.alert('it is visible');
    </View>
    );
  }
render(){
  return (
    <View>
      {this.sayHello}
    <TouchableOpacity onPress={this.sayHello}><Text>hi </Text></TouchableOpacity>
    </View>
  );
}
}
export default App;

import React，{Component}来自'React'；
进口{
样式表，
文本、状态栏、，
视图、按钮、图像、，
可触摸不透明度，
警觉的
}从“反应本机”；
类应用程序扩展组件{
建造师（道具）{
超级（道具）；
//this.sayHello=this.sayHello.bind（this）；
}
说你好=（）=>{
返回(
{/*//你好*/}
警惕。警惕（“它是可见的”）；
);
}
render（）{
返回(
{这个，你好}
你好
);
}
}
导出默认应用程序；

我制作了这个简单的文件，因为我无法解决许多错误。我将添加一个表单来代替警报。如果我在函数中返回多个组件，它将显示错误。

---

提前感谢

我想你想通过按下按钮来显示另一个视图！如果这是你想要的，这里是带有功能组件的代码

import React, { useState } from 'react'
import { Pressable } from 'react-native';
 const App = () => {
const [show, SetShow] = useState(false);
  return (
    <View>
      <Pressable onPress={() => SetShow(!show)}>
        {show === false ? <Text>Hi</Text> : <Text>Hello</Text>}
      </Pressable>
    </View>
  );
};

import React，{useState}来自“React”
从“react native”导入{Pressable}；
常量应用=（）=>{
const[show，SetShow]=useState（false）；
返回(
设置显示（！show）}>
{show==false？您好}
);
};