Usage

Description

The cervello function allows you to create a new store in an easy way. Just set the initial value (the type will be inferred based on this value) and you have it

Options (optional)

Name	Type	Default	Description
reactiveNestedObjects	boolean	true	By default, nested objects are proxied to allow reactivity on changes. Set to false if you want reactivity just on 1st-level object properties
name (from v2)	string (camelCase)	'store'	Name of the store. It will be used to return the store object and the other hooks based on the name provided. name must be provided in camelCase

Example

JavaScript

// store-example.ts

import { cervello } from '@cervello/react'


export const {
  store,       // Reactive store object
  useStore,    // Hook to use the store
  useSelector, // Hook to use the selectors (part of the store)
  reset,       // Function to reset the store 
} = cervello({ count: 0 })


/**
* You can also use a function to initialize the store
* (i.e.: initialize the store from a persisted data)
*/
const { store } = cervello(() => {
  const count = getInitialCounter()
  return { count }
})

TypeScript

// store-example.ts

import { cervello } from '@cervello/react'

interface Store {
  count: number
}

export const {
  store,       // Reactive store object
  useStore,    // Hook to use the store
  useSelector, // Hook to use the selectors (part of the store)
  reset,       // Function to reset the store 
} = cervello<Store>({ count: 0 })


/**
* You can also use a function to initialize the store
* (i.e.: initialize the store from a persisted data)
*/
const { store } = cervello<Store>(() => {
  const count = getInitialCounter()
  return { count }
})

Example with options

JavaScript

// store-example.ts

import { cervello } from '@cervello/react'


const options = {
  reactiveNestedObjects: false,
  name: 'redirectModal'
}

export const {
  redirectModalStore,       // Reactive store object
  useRedirectModalStore,    // Hook to use the store
  useRedirectModalSelector, // Hook to use the selectors (part of the store)
  resetRedirectModalStore,       // Function to reset the store
} = cervello({
    /** initial store */
  },
  options
)

TypeScript

// store-example.ts

import { cervello } from '@cervello/react'
import type { CervelloOptions } from '@cervello/react'

const options: CervelloOptions = {
  reactiveNestedObjects: false,
  name: 'redirectModal'
}

export const {
  redirectModalStore,       // Reactive store object
  useRedirectModalStore,    // Hook to use the store
  useRedirectModalSelector, // Hook to use the selectors (part of the store)
  resetRedirectModalStore,       // Function to reset the store
} = cervello({
    /** initial store */
  },
  options
)