VUX的使用方法(以弹出框为例)
一、安装
cnpm install vux --save
cnpm install vux-loader --save-dev
二、配置

const webpackConfig = {
...
}
module.exports = vuxLoader.merge(webpackConfig, {
options: {},
plugins: [{
name: 'vux-ui'
}]
})
三、调用
import { AlertPlugin } from 'vux'
Vue.use(AlertPlugin)
四、使用
this.$vux.alert.show({
title: '温馨提示',
content: '此桌已被预定!',
buttonText: '好的',
hideOnBlur: true,
maskZIndex: 100
})
提示标题为图片:
that.$vux.alert.show({
content: `您预约的订单已经成功取消,欢迎您再次预定!`,
buttonText: '好的',
maskZIndex: 100,
onShow () {
let alertImgLen = document.getElementsByClassName('weui-dialog__hd')[0]
alertImgLen.innerHTML = '<img src="../../static/images/tip3.png" class="alertImg3">'
},
onHide () {
that.$router.push('/orderInfo')
}
})
五、效果


VUX的使用方法(以弹出框为例)的更多相关文章
- ckfinder在IE10,IE9中的弹出框不能选择,或者不能上传解决方法
在IE9,或IE10中ckfinder在IE10,IE9中的弹出框不能选择,或者不能上传解决方法 把弹出框嵌入到jquery dialog中.可以解决 I did: // javascript f ...
- vue封装公用弹出框方法,实现点击出现操作弹出框
vue封装公用弹出框方法,实现点击出现操作弹出框 如上图所示,这次要实现一个点击出现操作弹框的效果:并将这个功能封装成一个函数,便于在项目的多个地方使用. 具体思路是: 封装一个组件,组件保护一个插槽 ...
- Android 学习笔记之AndBase框架学习(二) 使用封装好的进度框,Toast框,弹出框,确认框...
PS:渐渐明白,在实验室呆三年都不如在企业呆一年... 学习内容: 1.使用AbActivity内部封装的方法实现进度框,Toast框,弹出框,确认框... AndBase中AbActivity封 ...
- 【原创】贡献一个JS的弹出框代码...
一.前言 最近在做一个项目,自己感觉系统自带的alert()方法的弹出框实在是不堪入目,所以在网上找了一些资料,然后自己加工了一下,做出了自己的一个js弹出框,在这里贡献出来,希望对你有帮助. 二.开 ...
- iPad弹出框
弹出框是iPad的常用UI元素,即在现有视图上面显示内容,并通过一个小箭头指向一个屏幕对象(如按钮),以提供上下文. 和模态场景一样,弹出框的内容也由一个视图和一个试图控制器决定,不同之处在于,弹出框 ...
- [Js插件]使用JqueryUI的弹出框做一个“炫”的登录页面
引言 查看项目代码的时候,发现项目中用到JqueryUi的弹出框,可拖拽,可设置模式对话框,就想着使用它弄一个登录页面. 弹出框 在Jquery Ui官网可定制下载弹出框,下载和弹出框下载相关的js文 ...
- 第二百四十六节,Bootstrap弹出框和警告框插件
Bootstrap弹出框和警告框插件 学习要点: 1.弹出框 2.警告框 本节课我们主要学习一下 Bootstrap 中的弹出框和警告框插件. 一.弹出框 弹出框即点击一个元素弹出一个包含标题和内容的 ...
- js swal()弹出框
做前端开发的时候时常会遇到修改成功.新增成功这类弹出框,用alert的话未免有点太low了,而swal()是一个简单又实用的弹出框方法 alert 弹出框样式如下: swal() 弹出框样式如下: 代 ...
- 练习PopupWindow弹出框之实现界面加载的时候显示弹出框到指定的view下面--两种延迟方法
今天在练习PopupWindow弹出框的时候,打算在界面加载的时候将弹出框展现出来并显示在指定的view下面. 初步方法是直接在OnResume方法里面直接执行showPopupWindows方法. ...
随机推荐
- Southeastern European Regional Programming Contest 2019
easy: I medium-easy: BDEGJ medium: F medium-hard: A A. B. 按 x 排序,\(dp[i][j][k]\) 表示考虑前 \(i\) 个物品,lev ...
- linux mysql主从复制配置
1.设置主库master的servie-id值并且开启bin-log功能参数vi /etc/my.cnf修改my.cnf的参数:[mysqld]server-id=1 //每一个库的server-id ...
- java异常继承何类,运行时异常与一般异常的区别
一.基本概念 Throwable是所有异常的根,java.lang.ThrowableError是错误,java.lang.ErrorException是异常,java.lang.Exception ...
- iOS音频开发系列-概述篇
概述 iOS中对于音频的处理,苹果提供了两个库. AVFoundation AudioToolbox 在iOS系统中apple对上述的流程进行了封装并提供了不同层次的接口
- IQueryable 和 IEnumerable(二)
IQueryable 和 IEnumerable的扩展方法 一 我们从ef的DbSet<T>看起来,我们看到他继承了IQueryable<T> 和 IEnumerable&l ...
- redis集群的学习(一)
redis配置文件详解 redis默认是不作为守护进程来运行的,你可以把这个设置为yes,让它作为守护进程来运行 注意,当作为守护进程的时候,redis 会把进程ID 写到/var/run/redis ...
- LoadRunner关联通用函数的学习
LoadRunner关联通用函数的学习 写这篇文章的时候,我先声明一下,本BLOG中的文章如果没有写出是转贴的一般就是本人原创. Loadrunner脚本中进行关联的时候,用到了一些函数,作用是把字符 ...
- centos7 创建桌面快捷方式(chrome,eclipse)
在将eclipse-SDK-3.7.2-Linux-gtk.tar.gz解压到某个目录下之后,命令行进行如下编辑 vi /usr/share/applications/eclipse.desktop ...
- Docker系列(一):Docker简单介绍
Docker简介: 多语言和框架:支持多语言和框架以及语言框架的扩展机制 多服务:开放的核心服务以及服务的扩展机制 多云和多IaaS技术:支持多种IaaS技术和多云的部署,包括公有云和私有云 Dock ...
- Maven父子工程配置文件详解
项目骨架搭建成功之后. 因为父工程管理子工程.子工程相当于继承于子工程,所以子工程可以调用父工程里面的东西.那么就可以将jar包对应的配置文件书写到父工程的pom.xml文件中,注意:父工程的打包方式 ...