# @watch-state/async > Get async data for watch-state Latest version **2.0.0-alpha.3** (published 2023-06-24) · MIT license · 0 weekly downloads ## Install ```sh npm install @watch-state/async pnpm add @watch-state/async yarn add @watch-state/async bun add @watch-state/async ``` ## 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 | 2.0.0-alpha.3 | | Published | 2023-06-24 | | First published | 2020-11-21 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | bundled | | Module format | ESM + CommonJS | | Dependencies | 3 | | Unpacked size | 27.2 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 0 | | Author | Mikhail Lysikov | | Maintainers | deight | | Keywords | async, await, data, watch, state, watch-state, front-end | ## Links - npm: https://www.npmjs.com/package/@watch-state/async - Repository: https://github.com/d8corp/watch-state-async - Issues: https://github.com/d8corp/watch-state-async/issues - npm.io page: https://npm.io/package/@watch-state/async ## Dependencies (3) - [tslib](https://npm.io/package/tslib.md) ^2.5.3 - [watch-state](https://npm.io/package/watch-state.md) ^3.5.0-alpha.2 - [@watch-state/decorators](https://npm.io/package/@watch-state/decorators.md) ^1.3.0-alpha.0 ## Alternatives - [@commercetools/sync-actions](https://npm.io/package/@commercetools/sync-actions.md) — 25.1K weekly downloads - [cwait](https://npm.io/package/cwait.md) — 21.4K weekly downloads - [@ledgerhq/hw-app-cosmos](https://npm.io/package/@ledgerhq/hw-app-cosmos.md) — 4.2K weekly downloads - [@financial-times/o-loading](https://npm.io/package/@financial-times/o-loading.md) — 2.8K weekly downloads - [fa](https://npm.io/package/fa.md) — 185 weekly downloads ## Recent versions - 2.0.0-alpha.3 (latest) — 2023-06-24 - 2.0.0-alpha.2 — 2023-06-12 - 2.0.0-alpha.1 — 2023-06-09 - 2.0.0-alpha.0 — 2023-06-09 - 1.2.4 — 2022-01-08 - 1.2.3 — 2022-01-07 - 1.2.2 — 2021-08-08 - 1.2.1 — 2021-08-07 - 1.2.0 — 2021-07-10 - 1.1.0 — 2021-01-12 - 1.0.1 — 2020-11-23 - 1.0.0 — 2020-11-21 ## README Watch-State logo by Mikhail Lysikov #   @watch-state/async   [![NPM](https://img.shields.io/npm/v/@watch-state/async.svg)](https://www.npmjs.com/package/@watch-state/async) [![downloads](https://img.shields.io/npm/dm/@watch-state/async.svg)](https://www.npmtrends.com/@watch-state/async) [![changelog](https://img.shields.io/badge/Changelog-⋮-brightgreen)](https://changelogs.xyz/@watch-state/async) [![license](https://img.shields.io/npm/l/@watch-state/async)](https://github.com/d8corp/watch-state-async/blob/main/LICENSE) Getting async data with [watch-state](https://www.npmjs.com/package/watch-state). [![stars](https://img.shields.io/github/stars/d8corp/watch-state-async?style=social)](https://github.com/d8corp/watch-state-async/stargazers) [![watchers](https://img.shields.io/github/watchers/d8corp/watch-state-async?style=social)](https://github.com/d8corp/watch-state-async/watchers) ### Installation npm ```bash npm i @watch-state/async ``` yarn ```bash yarn add @watch-state/async ``` ### Using `Async` is a `Promise` like class. `Async` constructor expects the first required argument as an async function and the second optional one as a default value. ```javascript import Async from '@watch-state/async' const promise = new Async(() => fetch('/test')) ``` ### then, catch, finally `then`, `catch` and `finally` always return an instance of `Promise` ```javascript const test = new Async(async () => {}).then() instanceof Promise // test === true ``` Use `then`, `catch` and `finally` like on `Promise` ```javascript const promise = new Async(async () => 1) promise .then(value => console.log('then', value)) .finally(value => console.log('finally', value)) .catch(value => console.log('catch', value)) ``` ### loading You may check status of `Async` with `loading`, it's `true` when data is loading ```javascript const promise = new Async(async () => {}) // promise.loading === true await promise // promise.loading === false ``` This is observable field, you can use `Watch` to observe it. ```javascript const promise = new Async(async () => {}) new Wathc(() => { console.log(promise.loading) }) // true await promise // false ``` > You can use the same way to watch on `loaded`, `value`, `error` ### loaded You may check status of `Async` with `loaded`, it's `true` when data was loaded at least one time ```javascript const promise = new Async(async () => {}) // promise.loaded === false await promise // promise.loaded === true ``` ### value You may get current result by `value` field ```javascript const promise = new Async(async () => 1) // promise.value === undefined await promise // promise.value === 1 ``` ### error You may handle error by `error` field ```javascript const promise = new Async(() => Promise.reject(1)) new Watch(() => { console.log(promise.error) }) // > undefined // > 1 ``` ### update Unlike `Promise`, you may reuse `Async` with `update` method ```javascript let i = 0 const promise = new Async(async () => i++) console.log(await promise) // > 0 // i === 1 promise.update() console.log(await promise) // > 1 // i === 2 ``` You can set timeout to make update only after some time. ```javascript let i = 0 const promise = new Async(async () => i++) console.log(await promise) // > 0 // i === 1 promise.update(1000) // nothing happends await promise // nothing happends await new Promise(resolve => setTimeout(resolve, 1000)) // nothing happends // 1 second passed, if use 1000ms it triggers update promise.update(1000) console.log(await promise) // > 1 // i === 2 ``` ## Issues If you find a bug, please file an issue on [GitHub](https://github.com/d8corp/watch-state-async/issues) [![issues](https://img.shields.io/github/issues-raw/d8corp/watch-state-async)](https://github.com/d8corp/watch-state-async/issues) --- _Source: https://npm.io/package/@watch-state/async · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._