# vue-compose-promise

> Easily manipulate Promises and their state in Vue

Latest version **0.0.5** (published 2019-09-26) · MIT license · 0 weekly downloads

## Install

```sh
npm install vue-compose-promise
pnpm add vue-compose-promise
yarn add vue-compose-promise
bun add vue-compose-promise
```

## Health

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

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

Warnings: low downloads; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.5 |
| Published | 2019-09-26 |
| First published | 2019-09-25 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 54.4 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 73 |
| Author | Eduardo San Martin Morote |
| Maintainers | posva |

## Links

- npm: https://www.npmjs.com/package/vue-compose-promise
- Repository: https://github.com/posva/vue-compose-promise
- Homepage: https://github.com/posva/vue-compose-promise#readme
- Issues: https://github.com/posva/vue-compose-promise/issues
- npm.io page: https://npm.io/package/vue-compose-promise

## Recent versions

- 0.0.5 (latest) — 2019-09-26
- 0.0.4 — 2019-09-25
- 0.0.3 — 2019-09-25
- 0.0.2 — 2019-09-25
- 0.0.1 — 2019-09-25
- 0.0.0 — 2019-09-25

## README

# vue-compose-promise [![Build Status](https://badgen.net/circleci/github/posva/vue-compose-promise)](https://circleci.com/gh/posva/vue-compose-promise) [![npm package](https://badgen.net/npm/v/vue-compose-promise)](https://www.npmjs.com/package/vue-compose-promise) [![coverage](https://badgen.net/codecov/c/github/posva/vue-compose-promise)](https://codecov.io/github/posva/vue-compose-promise) [![thanks](https://badgen.net/badge/thanks/♥/pink)](https://github.com/posva/thanks)

> Easily manipulate Promises and their state in Vue

**Depends on [@vue/composition-api](https://github.com/vuejs/composition-api)**

Demo (TODO link)

## Installation

```sh
npm install vue-compose-promise
```

## Usage

```vue
<template>
  <div>
    <span> Is the promise still pending: {{ usersPromise.isPending }} </span>
    <span> Is the 200ms delay over: {{ usersPromise.isDelayOver }} </span>
    <span>
      Last succesfully resolved data from the promise: {{ usersPromise.data }}
    </span>
    <span> Error if current promise failed: {{ usersPromise.error }} </span>
  </div>
</template>

<script>
import { createComponent } from '@vue/composition-api'
import { usePromise } from 'vue-compose-promise'

export default createComponent({
  setup() {
    const promised = usePromise({ pendingDelay: 200, promise: fetchUsers() })

    return {
      usersPromise: promised.state,

      fetchUsers() {
        promised.state.promise = fetchUsers()
      },
    }
  },
})
</script>
```

## API

### `usePromise<T>(options?: { pendingDelay?: number | Ref<number>; promise?: Promise<T> | Ref<Promise<T>> })`

- `options`
  - `pendingDelay`: amount of time in _ms_ that should be wait whenever the a new promise is pending. This allows delaying the display of a loader to avoid flashing the screen. Can be a _reactive_ property.
  - `promise`: initial promise. Can be null. Can be a _reactive_ property.

## Related

- [vue-promised](https://github.com/posva/vue-promised)
- [@vue/composition-api](https://github.com/vuejs/composition-api)

## License

[MIT](http://opensource.org/licenses/MIT)

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