Javascript 如何在react native中的另一个视图上渲染局部视图

当我在

renderMoreView

功能中尝试警报（“Hi”）时，它实际上可以工作，但显示视图是我面临的问题

export default class Home extends Component {
  state = {
    moreButton: false,
  };

  renderMoreView = () => {
    return (
      <View style={{flex: 1, height: 50, width: 50}}>
        <Text>Hi</Text>
      </View>
    );
  };

  render () {
    return (
      <View>
        .....
        <TouchableOpacity
          underlayColor="transparent"
          onPress={() => this.setState ({moreButton: true})}
        >
          <Feather name="more-vertical" size={25} />
        </TouchableOpacity>

        ...
        {this.state.moreButton ? this.renderMoreView () : null}
      </View>
    );
  }
}

导出默认类主扩展组件{
状态={
moreButton:错，
};
renderMoreView=（）=>{
返回(
你好
);
};
渲染（）{
返回(
.....
this.setState（{moreButton:true}）}
>
...
{this.state.moreButton？this.renderMoreView（）：null}
);
}
}

---

]

如果我正确理解您的问题，您可以使用

模态组件
 这可以使用
modal
完成。但是，如果您想做得更简单，请安装并使用该模块<代码>反应本机警报

$npm i响应本机可怕警报--保存

例子

从“React”导入React；
从“react native”导入{样式表、视图、文本、TouchableOpacity}；
从“react native AwesomeAlerts”导入AwesomeAlert；
导出默认类App扩展React.Component{
建造师（道具）{
超级（道具）；
this.state={showarert:false}；
};
showAlert=（）=>{
这是我的国家({
showAlert：对
});
};
hideAlert=（）=>{
这是我的国家({
showAlert:错误
});
};
render（）{
const{showAlert}=this.state；
返回(
我非常警觉
{
this.showart（）；
}}>
试试我！
尝试将
位置：绝对，顶部：10，左侧：10
添加到MoreView。您可以删除视图中的flex样式吗？并将背景颜色设置为白色，以便清晰地看到文本。