React + MobX: как получить доступ к хранилищу данных - через синглтон или через хук?

Использую React в связке с Mobx.

Хранилище с данными я реализовал как синглтон, чтобы получать к нему доступ из любого компонента:

export class Environment {
    private static _instance: Environment | null = null;

    data: any = {};

    // конструктор
    constructor() {
        makeObservable(
            this,
            {
                // общие данные
                data          :      observable,

                dropData      :      action,
                setData       :      action,
                set           :      action,
            },
            { 
                deep: true
            }
        );

        if (Environment._instance) return Environment._instance;

        Environment._instance = this;
    }

    // действие: установить общие данные
    set(obj: any) {
        this.data = obj;
    }

    // действие: сбросить общие данные
    dropData(field: string) {
        delete this.data[field];
    }

    // действие: размещение общие данных
    setData(field: string, value: any) {
        this.data[field] = value;
    }
}

вопрос такой - что-то я стал сомневаться в правильности такого подхода, хотя он и рабочий.

Подскажите, синглотон - это хорошая практика или в данном случае нужны другие решения, типа создания собственных хуков и т.п.?

Т.е. задача - есть общее MobX хранилище, которое содержит какие-то более мелкие хранилища (в примере оно только одно), к которому могут получать доступ любые функциональные компоненты (впрочем и классовые тоже)


Ответы (0 шт):