如何在React Native中构建可由多个组件访问的单个模态组件？

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

const ModalComponent = ({ isVisible, closeModal, children }) => {
  return (
    <Modal
      animationType="slide"
      transparent={true}
      visible={isVisible}
      onRequestClose={closeModal}
    >
      <View>{children}</View>
    </Modal>
  );
};

export default ModalComponent;

import React, { useState } from 'react';
import { Button, Text, View } from 'react-native';
import ModalComponent from './ModalComponent';

const App = () => {
  const [isModalVisible, setModalVisible] = useState(false);

  const openModal = () => {
    setModalVisible(true);
  };

  const closeModal = () => {
    setModalVisible(false);
  };

  return (
    <View>
      <Button title="Open Modal" onPress={openModal} />
      <ModalComponent isVisible={isModalVisible} closeModal={closeModal}>
        <Text>This is a modal component</Text>
        <Button title="Close Modal" onPress={closeModal} />
      </ModalComponent>
    </View>
  );
};

export default App;