javascript - How to create an internal store in library?

Question

Good Day!

We are creating a library, which has multiple classes(features) and user can access the modules by const features = new Library(/*Config*/). Inside the code we are fetching some APIs, whose response is needed in multiple classes. I fetched the response and saved them in an internal store explained below. (In separate module where I need store I import the path on top of file. )

How I am doing now?

import cloneDeep from 'lodash/cloneDeep';

class Store {
    #internalState: any

    constructor(initialState = {}) {
        this.#internalState = initialState;
    }

    get state() {
        return this.#internalState;
    }

    setState(value: any) {
        const currentState = cloneDeep(this.#internalState);
        const nextState = Object.assign(currentState, cloneDeep(value));
        this.#internalState = nextState;
        return nextState;
    }

}
console.log("called store");
export const store = new Store();

The problem I am facing is that when I created multiple instances of my library on same page(index.html) only single store instance is created and this class executes only once.Attached screenshot:

How can I modify my store class or any alternate approach, so that each instance have there own copy of store(Import)?

Any suggestion would be appreciated.

question from:https://stackoverflow.com/questions/66058353/how-to-create-an-internal-store-in-library

Answer 1

Waitting for answers