Чтобы позволить использовать несколько модальных окон одновременно, помещаю их в observable.map() таким образом
@observable modals = observable.map();
@action('add modal')
addModal = component => {
const id = createGuid();
this.modals.set(id, component);
};
@action
removeModal = id => {
this.modals.delete(id);
};
newModal = close => {
return (
<ModalWrap>
<Overlay onClick={close} />
<Body>
<div>content</div>
<Close action={close}>❌</Close>
</Body>
</ModalWrap>
);
};
Затем мне надо вывести их в нужном месте. я пытаюсь использовать что-то вроде
<>
{modals.entries().map(({ id, modal }) => (
<React.Fragment key={id}>
{modal(this.onClose(id))}
</React.Fragment>
))}
</>
modals.entries() судя по документации должен предоставить [key, value]. Затем в консоль "рендерит" entries(...).map is not a function. В чем ошибка?
Средний
