@rcp/use.uncontrolled

Make props.value piped to state, and exposes `onChange`, make react component is **uncontrolled & controlled**

Usage no npm install needed!

<script type="module">
  import rcpUseUncontrolled from 'https://cdn.skypack.dev/@rcp/use.uncontrolled';
</script>

README

@rcp/use.uncontrolled

NPM version NPM Downloads

Make props.value piped to state, and exposes onChange, make react component is uncontrolled & controlled

Installation

npm install @rcp/use.uncontrolled
# or use yarn
yarn add @rcp/use.uncontrolled

Usage

import useUncontrolled from '@rcp/use.uncontrolled'

API

useUncontrolled

Parameters

  • value {T} - Piped value
  • defaultValue {T} - Initialize value firstly
  • onChange {(value: T) => void} - Bind onChange handler when value updating
  • useEffect {typeof React.useLayoutEffect}
  • eq {(a: T, b: T) => boolean}

Examples

function Input({ value, onChangeValue, defaultValue }) {
  const [valueState, setValue] = useUncontrolled({ value, onChange: onChangeValue, defaultValue })

  return <input type="text" value={valueState} onChange={(evt) => setValue(evt.target.value)} />
}

Returns Array [T, ((value: T) => T | T) => void]

Related

Authors

This library is written and maintained by imcuttle, moyuyc95@gmail.com.

License

MIT