# vue-js-simple-toast

> A toast notification component for Vue.js 2+

Latest version **1.0.1** (published 2019-01-30) · 0 weekly downloads

## Install

```sh
npm install vue-js-simple-toast
pnpm add vue-js-simple-toast
yarn add vue-js-simple-toast
bun add vue-js-simple-toast
```

## 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.1 |
| Published | 2019-01-30 |
| First published | 2019-01-30 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 64.7 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | abaicus |
| Maintainers | abaicus |
| Keywords | vue, toast, notification, notice |

## Links

- npm: https://www.npmjs.com/package/vue-js-simple-toast
- Repository: https://github.com/abaicus/vue-simple-toast
- Homepage: https://github.com/abaicus/vue-simple-toast#readme
- Issues: https://github.com/abaicus/vue-simple-toast.git
- npm.io page: https://npm.io/package/vue-js-simple-toast

## Alternatives

- [update-check](https://npm.io/package/update-check.md) — 4.0M weekly downloads
- [react-native-onesignal](https://npm.io/package/react-native-onesignal.md) — 134.5K weekly downloads
- [react-redux-toastr](https://npm.io/package/react-redux-toastr.md) — 33.7K weekly downloads
- [@nocobase/plugin-notification-manager](https://npm.io/package/@nocobase/plugin-notification-manager.md) — 2.0K weekly downloads
- [react-simple-toasts](https://npm.io/package/react-simple-toasts.md) — 1.9K weekly downloads

## Recent versions

- 1.0.1 (latest) — 2019-01-30
- 1.0.0 — 2019-01-30

## README

<img src="https://badge.fury.io/js/vue-js-simple-toast.svg">
<img src="https://img.shields.io/npm/dm/vue-js-simple-toast.svg">


# Vue.js simple toast.

### Install

```bash
npm install vue-simple-toast --save
```

### Import

Import plugin:

```javascript
import simpleToast from 'vue-js-simple-toast'

Vue.use(simpleToast)
```
**OR**

Import component:

```javascript
import { simpleToast } from 'vue-js-simple-toast'

Vue.component('simpleToast', simpleToast)
```

### Use

```xml
<simple-toast  
    :class="type"
    :type="type"
    :dismissible="true"
    :auto-dismiss="false"
    iconClass="dashicons dashicons-yes"
    message="Options saved."
    >
</simple-toast>
```

### Properties

| Name            | Type              | Default     | Description                        |
| ---             | ---               | ---         | ---                                |
| autoDismiss           | Boolean           | false       | Should the toast auto-dismiss after 1.7s  |
| color     | [String, Object]  | undefined  | If `String` - background color of the toast. <br>If `Object` - background color for the toast in multiple types <br>Example: `{error: 'red', warning: 'yellow', success : 'green'}`   |
| dismissible           | Boolean            | true        | If the toast should be dismissible - adds a dismiss button.   |
| iconClass           | String            | undefined        | Icon class that will be added on the left of the notice   |
| message        | String           | undefined      | **Required** - the toast message |
| type           | String  | `success`  | Can be `['success', 'error', 'warning']`|

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