Package Exports

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (urs) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

useRefState

🔥 React hook for maintaining correct values, in a clean way

Features

TypeScript support
Zero dependencies
React Native support
Keep your state consistant within your callback functions

Installation

yarn add urs      or     npm i -S urs

Usage

import useRefState from 'urs'

const App = () => {
  const [state, setState] = useRefState()

  const onClick = () => {
    setState({ no: 'way' })

    // to get the actual state you must do
    console.log('state.current', state.current) // gives us { no: 'way' }
    // whereas if it were a normal `setState` it would be `undefined`

    // BUT, the caveat is you have to do `state.current.whatever`
    // you CANNOT destructure like: `const [{ current }, setState] = useState()`
  }

  return (
    <button onClick={handleClick}>Click Me!</button>
  )
}

Options

The 2nd argument of useRefState determines if you want to be able to update state when a component is unmounted. If true it will block setState on unmounted components. Useful for the common error cannot update state on unmounted component.

const [state, setState] = useRefState('same as useState default state', true)