Destell
@Destell
React, React Native junior developer

Как запустить рендер компонентов из MobX map react?

Чтобы позволить использовать несколько модальных окон одновременно, помещаю их в 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. В чем ошибка?
  • Вопрос задан
  • 169 просмотров
Решения вопроса 1
0xD34F
@0xD34F Куратор тега React
modals.entries() судя по документации должен предоставить [key, value]

Нет, не должен. Он итератор возвращает, а не массив. Так что

[...modals.entries()].map(([ id, modal ]) => (

))
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы