React Native - наложение модалов

Question

Modal 1 -- Component 1
              |
           Component 2
              |
Modal 2 -- Component 3

У меня есть сценарий, подобный приведенному выше «чертежу», где компонент 3 инициализируется в компоненте 2, который инициализируется в компоненте 1.

Каждый компонент 1 и 3 содержит компонент с модальным.

Если модальный компонент 3 открыт.Модал из компонента 1 скрыт за ним, если он открыт.Однако я хочу, чтобы он был сверху стека и в виде спереди.

Я попытался упорядочить вещи в коде, и я попытался с zIndex с абсолютной или относительной позицией.

{position: 'relative/absolute', overlay: {zIndex: 99}};

, но ни один из них не работает.

Я просмотрел похожие посты, но не смог найти ответ на этот труд.

Как я могу форсировать модал 1всегда быть видимым, если другие модалы открываются из «более высокого» компонента в стеке

Answer 1

Вы можете использовать модальный компонент или какой-то другой модуль.

Но если вы хотите создать свой собственный модал, вы можете следовать этому шаблону.

в вашем главном компоненте App, иметь 2 дочерних компонента

<App>
  <Home /> //All components/navigation are here
  {
    isModalOpen && <Modal />
  }
</App>

Установить модальный стиль на что-то вроде позиции: абсолютная, слева: 0, справа: 0, сверху: 0, снизу: 0