vt
v-toast
npm i v-toast
vt

v-toast

A toast component written with Vue, designed based on Ant Design [deprecated]

by Pomy

2.1.7 (see all)License:MITTypeScript:Not Found
npm i v-toast
Readme

Overview

A toast component written with Vue, designed based on Ant Design.


vue-toast 1.x deprecated

Show Cases

On pc:

toast-pc

On mobile:

toast-mobile

Installation

First, install vue-toast from npm:

npm install v-toast --save-dev

Or in package.json:

"dependencies": {
  "v-toast": "2.1.7"
}

Then use it:

//CommonJS
var Toast = require('v-toast');

Usage

Basically you can pass a string to Toast:

Toast.info('this is a example');

Or invoke Toast with an object as its configuration:

Toast.info({
  message: 'this is a example',
  duration: 5000
});

API

OpthionDescription
Toast.info(message:String|config:Object)show a info toast
Toast.success(message:String|config:Object)show a success toast
Toast.warn(message:String|config:Object)show a warn toast
Toast.error(message:String|config:Object)show a error toast
Toast.loading(message:String|config:Object)show a loading toast

Configuration

OpthionDescriptionDefault
messagea string as the content of the toast''
durationtime before the toast vanishes, in millisecond1500

If duration is 0, toast won't disappear but you invoke remove:

<button @click="loading"><span>显示加载中...</span></button>

loading() {
  const instance = Toast.loading({
    message:"Action....",
    duration:0
  });
  setTimeout(instance.remove, 2500);
}

This is useful showing loading state for user in async action.

License

MIT

Downloads/wk

10

GitHub Stars

19

LAST COMMIT

5yrs ago

MAINTAINERS

1

CONTRIBUTORS

3

OPEN ISSUES

2

OPEN PRs

0
VersionTagPublished
2.1.7
latest
6yrs ago
No alternatives found
No tutorials found
Add a tutorial

Rate & Review

100
No reviews found
Be the first to rate