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的更多相关文章

  1. Atitit. Toast alert loading js控件   atiToast v2新特性

    Atitit. Toast alert loading js控件   atiToast v2新特性 1. 连续多个txt追加的原理 var txt = document.createElement(& ...

  2. vue2.0 仿手机新闻站(五)全局的 loading 组件

    1.组件结构 index.js const LoadingComponent = require('./Loading.vue') const loading = { install: functio ...

  3. Vuejs自定义全局组件--loading

    不管是使用框架,还是不使用任何的框架,我们都不可避免的需要与“加载中……”打交道,刚刚学习了Vuejs自定义组件的写法,就现学现卖,介绍一下吧! 先看一下目录结构,一般情况下,每一个组件都新建一个新的 ...

  4. vux 全局注册组件

    背景:调试better-scroll的时候进行封装,作为组件来调用: 希望:全局注册组件: 1,在src的main.js下: 这样就可以用了:

  5. Vux项目搭建

    1.快速搭建项目模板 因为项目使用vux,所以推荐使用vux官网的airyland/vux2 模板,vue-cli工具是vue项目的搭建脚手架 默认为 webpack2 模板,如果你需要使用webpa ...

  6. vue2.0 + vux 项目搭建

    1.快速搭建项目模板 因为项目使用vux,所以推荐使用vux官网的airyland/vux2 模板,vue-cli工具是vue项目的搭建脚手架 默认为 webpack2 模板,如果你需要使用webpa ...

  7. ajax请求加全局loading , 个别特殊请求不显示loading

    项目中,请求开始前加载loading遮罩层,请求结束关闭遮罩,一般都会加在全局中,但有个别请求不需要加全局loading 的话,这时候就需要对这些请求进行配置 全局加loading: ; functi ...

  8. 如何优雅的使用vue+vux开发app -03

    如何优雅的使用vue+vux开发app -03 还是一个错误的示范,但是离优雅差的不远了... <!DOCTYPE html> <html> <head> < ...

  9. 如何优雅的使用vue+vux开发app -02

    如何优雅的使用vue+vux开发app -02 很明显这又是一个错误的示范,请勿模仿 使用动态组件实现保留状态的路由 <!DOCTYPE html> <html> <he ...

随机推荐

  1. MyHome3D在线装修设计软件测评

    人人都是设计师 ——MyHome3D在线装修设计软件 关键词:云技术,3D呈现效果,自主设计,简单易用,家具装修设计 上海爱福窝云技术有限公司借助于前沿的3D渲染技术,降低了装修设计的门槛,真正实现了 ...

  2. Which dispatch method would be used in Swift?

    In this example: protocol MyProtocol { func testFuncA() } extension MyProtocol { func testFuncA() { ...

  3. 6-Java-C(打印大X)

    题目描述: 小明希望用星号拼凑,打印出一个大X,他要求能够控制笔画的宽度和整个字的高度. 为了便于比对空格,所有的空白位置都以句点符来代替. 要求输入两个整数m n,表示笔的宽度,X的高度.用空格分开 ...

  4. python练习2 购物车程序

    # -*- coding: utf-8 -*-# @Time : 2018/10/18 16:06# @Author : Two Brother# @EMAIL : yeluyide@163.com# ...

  5. console.log()与console.dir()

    console.log()可以取代alert()或document.write(),在网页脚本中使用console.log()时,会在浏览器控制台打印出信息. console.dir()可以显示一个对 ...

  6. Linux安装64位Mysql5.7.22

    以安装在/usr/local目录下为例 1.下载安装包地址:https://dev.mysql.com/downloads/file/?id=476936,安装包保存到/usr/local 2.解压: ...

  7. 秋招复习-C++( 一)

    Linux/Unix编程部分 1.进程间通信方式:信号,信号量,消息队列,共享内存,套接字Socket 2.ipcs: Linux/Unix下的命令,可以用来查看当前系统中所使用的进程间通信方式的各种 ...

  8. Python 字符编码-文件处理

    .read #读取所有内容,光标移动到文件末尾.readable #判断文件是否可读.readline #读取一行内容,光标移动到第二行首部.readlines #读取每一行内容,存放于列表中.wri ...

  9. 零基础入门学习Python(16)--序列!序列!

    前言 你可能发现了,小甲鱼把这个列表,元组,字符串放在一起讲是有道理的,它们有许多共同点: 都可以通过索引得到每一个元素 默认索引值总是从0开始 可以通过分片的方法得到一个范围内的元素的集合 有很多共 ...

  10. linux目录文件操作

    一.linux系统目录结构 1.顶层根目录 顶层根目录使用 “/”来表示 2.linux中的一些重要目录 (1)bin目录 放置常用的可执行文件(其中ls命令位列其中) (2)sbin目录 放置系统的 ...