All Projects → alanchenchen → vue2-dialog

alanchenchen / vue2-dialog

Licence: Apache-2.0 license
A mobile Vue plugin for VueDialog

Programming Languages

Vue
7211 projects
javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to vue2-dialog

V Dialogs
A simple and clean instructional dialog plugin for Vue2, dialog type including Modal, Alert, Mask and Toast
Stars: ✭ 121 (+476.19%)
Mutual labels:  alert, dialog, toast, vue2
Wc Messagebox
基于 Vue 2.0 开发的 Alert, Toast, Confirm 插件, UI仿照 iOS 原生
Stars: ✭ 203 (+866.67%)
Mutual labels:  alert, dialog, toast, confirm
Razor.SweetAlert2
A Razor class library for interacting with SweetAlert2
Stars: ✭ 98 (+366.67%)
Mutual labels:  alert, dialog, toast, confirm
Sweetalert2
A beautiful, responsive, highly customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes. Zero dependencies.
Stars: ✭ 13,929 (+66228.57%)
Mutual labels:  alert, dialog, toast, confirm
Notie
🔔 a clean and simple notification, input, and selection suite for javascript, with no dependencies
Stars: ✭ 6,170 (+29280.95%)
Mutual labels:  alert, toast, confirm
Easyshowview
一款非常简单的展示工具。提示框,加载框,空白页提示,alert弹出框。一行代码搞定所有操作。
Stars: ✭ 447 (+2028.57%)
Mutual labels:  alert, toast, actionsheet
Jh flutter demo
a flutter demo
Stars: ✭ 229 (+990.48%)
Mutual labels:  alert, dialog, toast
react-st-modal
Simple and flexible modal dialog component for React JS
Stars: ✭ 41 (+95.24%)
Mutual labels:  alert, dialog, confirm
mobile-message
基于移动端的弹窗组件,默认提供info、success、warning、error、alert、confirm、multiple、vertical、bottomSheet、prompt,可自定义弹窗。它可以包含任何Html内容可以自定义弹窗的样式,也可以加入自定以的弹窗动画。
Stars: ✭ 13 (-38.1%)
Mutual labels:  alert, dialog, confirm
Layer
丰富多样的 Web 弹出层组件,可轻松实现 Alert/Confirm/Prompt/ 普通提示/页面区块/iframe/tips等等几乎所有的弹出交互。目前已成为最多人使用的弹层解决方案
Stars: ✭ 8,202 (+38957.14%)
Mutual labels:  alert, dialog, confirm
Jbox
jBox is a jQuery plugin that makes it easy to create customizable tooltips, modal windows, image galleries and more.
Stars: ✭ 1,251 (+5857.14%)
Mutual labels:  alert, dialog, confirm
Vuejs Dialog
A lightweight, promise based alert, prompt and confirm dialog
Stars: ✭ 327 (+1457.14%)
Mutual labels:  alert, dialog, confirm
Alertifyjs
A javascript framework for developing pretty browser dialogs and notifications.
Stars: ✭ 1,922 (+9052.38%)
Mutual labels:  alert, dialog, confirm
Jquery Confirm
A multipurpose plugin for alert, confirm & dialog, with extended features.
Stars: ✭ 1,776 (+8357.14%)
Mutual labels:  alert, dialog, confirm
Alerttoast
Create Apple-like alerts & toasts using SwiftUI
Stars: ✭ 151 (+619.05%)
Mutual labels:  alert, dialog, toast
BalloonPopup
Forget Android Toast! BalloonPopup displays a round or squared popup and attaches it to a View, like a callout. Uses the Builder pattern for maximum ease. The popup can automatically hide and can persist when the value is updated.
Stars: ✭ 32 (+52.38%)
Mutual labels:  alert, dialog, toast
React Native Alert Pro
The Pro Version of React Native Alert (Android & iOS)
Stars: ✭ 69 (+228.57%)
Mutual labels:  alert, dialog, confirm
jquery.dialog.js
A lightweight replacement for the browser's default dialog boxes.
Stars: ✭ 17 (-19.05%)
Mutual labels:  alert, dialog, confirm
iakit
无依赖 mini 组件库,只封装了 alert, toast, loading, actionSheet 等使用频率较高的组件。适用于类似 H5 活动页的简单移动端项目,不必为了使用这些组件而引入一个大而全的 UI 库和框架。
Stars: ✭ 38 (+80.95%)
Mutual labels:  alert, toast, actionsheet
Notiflix
Notiflix is a JavaScript library for client-side non-blocking notifications, popup boxes, loading indicators, and more that makes your web projects much better.
Stars: ✭ 172 (+719.05%)
Mutual labels:  alert, toast, confirm

vue2-dialog

A mobile Vue plugin for Dialog

pluginName: vue2-dialog

version: 1.1.0

author: Alan Chen

github: [email protected]

date: 2018/10/15

This plugin is just only adapted for mobile.Please use the rem layout

Please go to the release to see version logs.

What you can do with the plugin

  • You can use it to make several kinds of dialog components such as Alert,Confirm,ActionSheet,Toast.And you can also use the components like CascadingPicker,Loading and Scroller

dialog

中文文档

How to use

  • NPM install the vue2-dialog plugin
	yarn add vue2-dialog or npm install vue2-dialog --save

1.vue spa

  • import the plugin and use (global use)
import VueDialog from 'vue2-dialog'
import 'vue2-dialog/dist/VueDialog.css'

Vue.use(VueDialog)
  • import some components that you need and use (local use)
import { Scroller, Alert, Confirm } from 'vue2-dialog'
import 'vue2-dialog/dist/VueDialog.css'

Vue.component(Scroller.name, Scroller)
Vue.component(Alert.name, Alert)
Vue.component(Confirm.name, Confirm)

2.script html

  • directly write the script,in deed you have to insert the vue.js script firstly
<link href="node_modules/vue2-dialog/dist/VueDialog.css"></link>
<script src="node_modules/vue2-dialog/dist/VueDialog.js"></script>
  • use the components directly in your vue spa file or the Vue instance ,like
<Alert />
<Confirm />
<Toast />
<Scroller />
...

Components Docs

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].