Office Fluent UI / Fabri c UI Modal - как я могу контролировать, где он появляется? - PullRequest
0 голосов
/ 29 апреля 2020

В настоящее время я использую элементы управления MS Fluent UI (ранее известный как Office Fabri c UI | https://developer.microsoft.com/en-us/fluentui# / controls / web ), и я застреваю с элементом управления 'Modal' ,

Я запускаю модальный диалоговый элемент управления как событие onClick для элемента управления DocumentCard. Проблема в том, что я не вижу способа сохранить диалог новой модели по центру экрана.

Кажется, что он всегда центрируется на элементе, который содержит все карточки документов (и там много карточек ... так что вам в конечном итоге придется пролистать довольно много, чтобы увидеть модальное диалоговое окно).

Есть ли способ просто установить его "в центре (видимого) окна"?

Ниже приведен фрагмент из компонента React, в котором находится диалоговое окно «Карточка документа и модальное окно».

return (
    <DocumentCard onClick={showModal}>
        <DocumentCardTitle title={this.props.Title} shouldTruncate />
        <Image {...imageProps} className={styles.image} />
        <DocumentCardTitle title={this.props.event.Description} 
                           shouldTruncate showAsSecondaryTitle />
         <Modal isOpen={isModalOpen} onDismiss={hideModal} isBlocking={true}>
            <div>
                <span id={titleId}>{this.props.Title}</span>
            </div>
            <div>
                <p>
                    {this.props.event.Description}
                </p>
           </div>
        </Modal>
    </DocumentCard>
);
...