Skip to main content

Store

A store in DOMY is a shared reactive state that multiple components can access. It allows for state management across different parts of an application.

Defining a Store​

To create a store, use the signal function inside your hook. Then you just need to instancify your hook globaly instead of being declared into DOMY instance.

const { signal } = DOMY;

function useCount() {
  const count = signal(0);
  return { count };
}

const counterStore = useCount();

DOMY.createApp(() => {
  // ...
}).mount();

Example​

<count></count> <br />
<count></count>
const { signal } = DOMY;

function useCount() {
  const count = signal(0);
  return { count };
}

const counterStore = useCount();

const Count = DOMY.createComponent({
  html: `
    <div>
      <p>{{ count }}</p>
      <button @click="count++">+</button>
      <button @click="count--">-</button>
    </div>
  `,
  app: () => {
    return { count: counterStore.count };
  }
});

DOMY.createApp().components({ Count }).mount();