# use-action

> React useAction hook.

Latest version **1.0.4** (published 2020-11-10) · MIT license · 0 weekly downloads

## Install

```sh
npm install use-action
pnpm add use-action
yarn add use-action
bun add use-action
```

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2020-11-10 |
| First published | 2019-06-17 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 3.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 15 |
| Author | awmleer |
| Maintainers | awmleer |
| Keywords | react, hook, action, effect |

## Links

- npm: https://www.npmjs.com/package/use-action
- Repository: git@github.com:awmleer/use-action
- npm.io page: https://npm.io/package/use-action

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 1.0.4 (latest) — 2020-11-10
- 1.0.3 — 2020-11-10
- 1.0.2 — 2019-06-19
- 1.0.1 — 2019-06-17
- 1.0.0 — 2019-06-17

## README

# useAction

Almost same to useEffect, but not deferred.

## Why `useAction`?

> Unlike componentDidMount and componentDidUpdate, the function passed to useEffect fires after layout and paint, during a deferred event. This makes it suitable for the many common side effects, like setting up subscriptions and event handlers, because most types of work shouldn’t block the browser from updating the screen.

From [React docs](https://reactjs.org/docs/hooks-reference.html#timing-of-effects).

But `useAction` can execute the action function immediately after `useAction` get called.

## Example

### useEffect

```jsx
function Foo(props) {
  ref = useRef(null)
  useEffect(() => {
    ref.current = 'initialized'
  }, [])
  console.log(ref.current) // -> null
  return null
}
```

### useAction

```jsx
function Foo(props) {
  ref = useRef(null)
  useAction(() => {
    ref.current = 'initialized'
  }, [])
  console.log(ref.current) // -> initialized
  return null
}
```

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