# react-use-that

> Basic and powful react hooks

Latest version **1.1.1** (published 2019-12-31) · Unlicense license · 0 weekly downloads

## Install

```sh
npm install react-use-that
pnpm add react-use-that
yarn add react-use-that
bun add react-use-that
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.1 |
| Published | 2019-12-31 |
| First published | 2019-09-22 |
| Weekly downloads | 0 |
| License | Unlicense |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 16.6 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 5 |
| Author | @keshidong |
| Maintainers | keshidong.dev |

## Links

- npm: https://www.npmjs.com/package/react-use-that
- Repository: https://github.com/keshidong/react-use-that
- Homepage: https://github.com/keshidong/react-use-that#readme
- Issues: https://github.com/keshidong/react-use-that/issues
- npm.io page: https://npm.io/package/react-use-that

## Dependencies (1)

- [react-fast-compare](https://npm.io/package/react-fast-compare.md) ^2.0.4

## Recent versions

- 1.1.1 (latest) — 2019-12-31
- 1.0.3 (legacy) — 2019-09-30
- 1.1.0 — 2019-10-25
- 1.0.4 — 2019-10-25
- 1.0.2 — 2019-09-26
- 1.0.1 — 2019-09-22
- 1.0.0 — 2019-09-22

## README

<h1>
    <br />
    react-use-that
</h1>
<sup>
    <a href="https://www.npmjs.com/package/react-use-that">
       <img src="https://img.shields.io/npm/v/react-use-that.svg" alt="npm package" />
    </a>
    <a href="https://travis-ci.com/keshidong/react-use-that">
      <img src="https://travis-ci.com/keshidong/react-use-that.svg?branch=master" alt="travis master" />
    </a>
  </sup>
<br />
<h3>Basic and powful react hooks</h3>

## Install
<pre>npm i <a href="https://www.npmjs.com/package/react-use-that">react-use-that</a></pre>
  
## Usages
#### useCallback

*"useCallback Hooks"* same as react/useCallback, more powerful than react/usecallback, the reference of useCallback's return value is unchanged.

```javascript
import { useCallback } from 'react-use-that'
export default ({ p }) => {
    const cb = useCallback(() => {
        // ...
    }, [p])
    // do something with cb
}
```

#### useCurrent

*"useCurrent Hooks"* can get the value of the latest render function execution context.


```javascript
import { useCurrent } from 'react-use-that'
export default ({ count }) => {
    const getCount = useCurrent(count)
    
    ...
    // can use getCount in other callback
    getCount() 
}
```

#### useState

*"useState Hooks"* can perform the callback in didUpdate caused by the corresponding setState.

```javascript
import { useState } from 'react-use-that'
export default () => {
    const [count, setCount] = useState(0)
    
    ...
    // place setCount in other callback
    setCount(1, () => {
        // didUpdate
        ...
    }) 
}
```
#### useMount

*"useMount Hooks"* can perform the callback defined by the latest render function context before didMount or willUnmount.
The parameter callback is only executed once in didMount, you don't need to care about redundant execution due to dependency changes.

```javascript
import { useMount } from 'react-use-that'
export default () => {
    useMount(() => {
        // didMount
        
        return () => {
            // the return function is opt
            // willUnmount
        }
    })
}
```

---
_Source: https://npm.io/package/react-use-that · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._