szboynono / mosha-vue-toastify

A light weight and fun Vue 3 toast or notification or snack bar or however you wanna call it library.
https://szboynono.github.io/mosha-vue-toastify/
MIT License
222 stars 15 forks source link
notification snackbar toast vite vue vue-toast vue3

Mosha Vue Toastify

Build Status

A lightweight and fun Vue 3 toast or notification or snack bar or however you wanna call it library.

English | 简体中文

alt text

Talk is cheap, show me the demo

Try it out in the playground in the documentation

Features

Installation

With NPM:

$ npm install mosha-vue-toastify

With Yarn:

$ yarn add mosha-vue-toastify

The gist

<template>
  <button @click="toast">Toast it!</button>
</template>
<script lang='ts'>
import { defineComponent } from 'vue'
// import the library
import { createToast } from 'mosha-vue-toastify';
// import the styling for the toast
import 'mosha-vue-toastify/dist/style.css'

export default defineComponent({
  name: 'HelloWorld',
  setup () {
    const toast = () => {
        createToast('Wow, easy')
    }
    return { toast }
  }
})
</script>

Configuration

The createToast function accepts 2 arguments:

Support

Give this project a ⭐ if you like it. Any suggestions are welcome!