Get store when specified properties change

useSelector

const { useSelector } = cervello({ example: true })

Description

React hook that allows you to have a reactive store which re-renders when a the specified properties change.

If you have set a name for the store, the returned object property will be use{name}Selector

Input parameters

Name	Type	Default	Description
selectors	Array<string>	Required	Array of store properties to be watched
isEqualFunction	(prev, curr) => boolean	Equals comparison with JSON.stringify	Custom function to compare the new value with the old one

To consider

If you want to modify a property of the store, you need to use it without destructuring, like this:

const { useSelector } = cervello({ isActive: true })

const ExampleComponent = () => {
  const store = useSelector(['isActive'])
  return (
    <button onClick={() => store.isActive = false}>
      Set Active to false
    </button>
  )
}

Example

JavaScript

import { useSelector } from './store-example'

const CounterLabel = () => {
  /**
  * This will re-render just only when the property `count` changes
  */
  const { count } = useSelector(['count'])

  return (<span>{ count }</span>)
}

TypeScript

import { useSelector } from './store-example'

const CounterLabel = () => {
  /**
  * This will re-render just only when the property `count` changes
  */
  const { count } = useSelector(['count'])

  return (<span>{ count }</span>)
}