vux 全局使用 loading / toast / alert
1.入口文件
main.js
import { LoadingPlugin, ToastPlugin, AlertPlugin } from 'vux'
Vue.use(LoadingPlugin);
Vue.use(ToastPlugin,{position: 'top'});
Vue.use(AlertPlugin);
2.使用
// LoadingPlugin
// 显示
this.$vux.loading.show({
text: '加载中...'
})
// 隐藏
this.$vux.loading.hide() // ToastPlugin
// 显示
this.$vux.toast.show({
text: '加载中...'
})
// 显示文字
this.$vux.toast.text('hello', 'top')
// 隐藏
this.$vux.toast.hide() // AlertPlugin
// 显示
this.$vux.alert.show({
title: 'Vux is Cool',
content: 'Do you agree?',
onShow () {
console.log('Plugin: I\'m showing')
},
onHide () {
console.log('Plugin: I\'m hiding')
}
})
// 隐藏
this.$vux.alert.hide()
.
vux 全局使用 loading / toast / alert的更多相关文章
- Atitit. Toast alert loading js控件 atiToast v2新特性
Atitit. Toast alert loading js控件 atiToast v2新特性 1. 连续多个txt追加的原理 var txt = document.createElement(& ...
- vue2.0 仿手机新闻站(五)全局的 loading 组件
1.组件结构 index.js const LoadingComponent = require('./Loading.vue') const loading = { install: functio ...
- Vuejs自定义全局组件--loading
不管是使用框架,还是不使用任何的框架,我们都不可避免的需要与“加载中……”打交道,刚刚学习了Vuejs自定义组件的写法,就现学现卖,介绍一下吧! 先看一下目录结构,一般情况下,每一个组件都新建一个新的 ...
- vux 全局注册组件
背景:调试better-scroll的时候进行封装,作为组件来调用: 希望:全局注册组件: 1,在src的main.js下: 这样就可以用了:
- Vux项目搭建
1.快速搭建项目模板 因为项目使用vux,所以推荐使用vux官网的airyland/vux2 模板,vue-cli工具是vue项目的搭建脚手架 默认为 webpack2 模板,如果你需要使用webpa ...
- vue2.0 + vux 项目搭建
1.快速搭建项目模板 因为项目使用vux,所以推荐使用vux官网的airyland/vux2 模板,vue-cli工具是vue项目的搭建脚手架 默认为 webpack2 模板,如果你需要使用webpa ...
- ajax请求加全局loading , 个别特殊请求不显示loading
项目中,请求开始前加载loading遮罩层,请求结束关闭遮罩,一般都会加在全局中,但有个别请求不需要加全局loading 的话,这时候就需要对这些请求进行配置 全局加loading: ; functi ...
- 如何优雅的使用vue+vux开发app -03
如何优雅的使用vue+vux开发app -03 还是一个错误的示范,但是离优雅差的不远了... <!DOCTYPE html> <html> <head> < ...
- 如何优雅的使用vue+vux开发app -02
如何优雅的使用vue+vux开发app -02 很明显这又是一个错误的示范,请勿模仿 使用动态组件实现保留状态的路由 <!DOCTYPE html> <html> <he ...
随机推荐
- H5 canvas-小球抛物线
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- bzoj3994: [SDOI2015]约数个数和(反演+结论?!)
这题做的历程堪称惊心动魄 刚刚学了莫比乌斯反演的我高高兴兴的和cbx一起反演式子 期间有突破,有停滞,有否定 然后苟蒻的我背着cbx偷偷打开了题解 看到了 我...... 去你的有个性质啊(当然还是自 ...
- CAD使用GetxDataLong读数据(com接口)
主要用到函数说明: MxDrawEntity::GetxDataLong2 读取一个Long扩展数据,详细说明如下: 参数 说明 [in] LONG lItem 该值所在位置 [out, retval ...
- -- HTML标记大全参考手册[推荐]
-- HTML标记大全参考手册[推荐]总类(所有HTML文件都有的) 文件类型 <HTML></HTML> (放在档案的开头与结尾) 文件主题 <TITLE>&l ...
- https://blog.csdn.net/blmoistawinde/article/details/84329103
背景 很多场景需要考虑数据分布的相似度/距离:比如确定一个正态分布是否能够很好的描述一个群体的身高(正态分布生成的样本分布应当与实际的抽样分布接近),或者一个分类算法是否能够很好地区分样本的特征 ...
- 【Jsp,Servlet初学总结】 含 cookie和session的使用
一.Jsp 1. 指令: <%@ page language="java" import="java.*" contextType="text/ ...
- prop 和 attr 中一些羞羞的事情
引言 前几天做一个迷你京东小项目的时候涉及到一个全选的小功能,一开始用的是 attr,但是效果完全不是自己想要的,当商品按钮点击过一次后,attr就无法对其状态进行更改,最后谷歌了一番发现需要用 pr ...
- JqueryValidate 修改 为根据ID验证
<!--修改validate根据ID验证 --> <script type="text/javascript"> if ($.validator) { $. ...
- Spring 事物注解属性
@Transactional属性 . propagation 事物的传播属性 . isolation 事物的隔离属性 . readonly 设置只读属性 . timeout 设置超时属性 . roll ...
- 关于Filter中ServletRequest和ServletResponse强转HttpServletRequest和HttpServletResponse
---转载自:https://www.cnblogs.com/mei0619/p/8341159.html request对象的生成方式不是ServletRequest request = new S ...