Данный метод позволяет открыть в основном интерфейсе модальное окно с дополнительной страницей вашего мини-приложения.
Платформы
- B2B-Web
Все методы Condo Bridge могут быть использованы внутри страницы модального окна так же, как и внутри основного окна мини-приложения.
Параметры метода
| Имя параметра | Тип параметра | Обязательный | Описание параметра |
|---|---|---|---|
| title | string | да | Заголовок модального окна |
| url | string | да | url страницы, которая будет открыта в модальном окне |
| size | small | big | нет | Размер модального окна. Примеры можно найти здесь |
Возвращаемое значение
При успешном выполнении метод вернет назад JSON-объект, содержащий единственное поле
modalId - ID открытого модального окна,
который может быть использован для его закрытия:json{ "modalId": "d21ec5e9-aafe-4552-b8ce-825f9c48c7ea" }
Также данный параметр будет вшит в url открываемого окна в качестве query-параметра, поэтому вам не надо самостоятельно организовывать его проброс из основного окна.
Пример использования
Ниже приведен пример вызова модального окна из основной страницы мини-приложения:
typescript// pages/index.tsx import React, { useCallback, useState } from 'react' import bridge from '@open-condo/bridge' import { Button } from '@open-condo/ui' export default function MiniappPage (): React.ReactNode { const [openModalId, setOpenModalId] = useState<string | null>(null) const openModal = useCallback(() => { bridge.send('CondoWebAppShowModalWindow', { url: 'http://localhost:3001/modal', size: 'small', title: 'My modal title', }).then((data) => { setOpenModalId(data.modalId) }) }, []) return ( <Button type='primary' onClick={openModal}>Open modal window</Button> ) }
