<template>
<div>
<cube-button icon="cubeic-right" @click="goNext">Button With Icon</cube-button>
</div>
</template> <script>
export default {
methods:{
goNext(){
const toast = this.$createToast({
txt: 'Loading...', // 提示信息
type: 'correct', // type 字段决定了 Toast 的显示图标类型 txt纯文本常用
time: 3000, // 显示时间长短
maskClosable: true, // 点击蒙层是否隐藏
mask: true // mask 设置为 true 时会显示遮罩
})
toast.show() // 实例方法(显示)
setTimeout(() => {
toast.hide() // 实例方法(隐藏)加setTimeout原有 + 1s
console.log(11111) // 11111
}, 2000)
}
}
}
</script> <style> </style>

cube-ui按钮配合toast单例模式应用的更多相关文章

  1. 背水一战 Windows 10 (105) - 通知(Toast): 带按钮的 toast, 带输入的 toast(文本输入框,下拉选择框)

    [源码下载] 背水一战 Windows 10 (105) - 通知(Toast): 带按钮的 toast, 带输入的 toast(文本输入框,下拉选择框) 作者:webabcd 介绍背水一战 Wind ...

  2. Atitit.获取swing ui 按钮控件的id 与名字 与JPDA 调试体系

    Atitit.获取swing ui 按钮控件的id 与名字 与JPDA 调试体系 1. Swing Inspector是一个Java Swing/AWT用户界面分析和调试工具,功能与firebug类似 ...

  3. 单选复选按钮以及Toast学习笔记

    1:单选按钮是以组的形式呈现,xml布局文件中需要定义一个RadioGroup,然后在这个组内再定义RadioButton.在java代码中为该按钮添加监听时,需要用组名来引用对应的方法setOnCh ...

  4. unity中实现监听鼠标的进入和退出某一个UI按钮

    using UnityEngine; using System.Collections; using Assets.Code.myclass; using UnityEngine.UI; using ...

  5. IOS之UI -- 按钮UIButton的细节

    *:first-child { margin-top: 0 !important; } body > *:last-child { margin-bottom: 0 !important; } ...

  6. 关于Cocos2d-x中UI按钮的定义

    1.要有两张不同状态的图片 2.定义一个MenuItemSprite的实例,把这两张图的Sprite实例放进MenuItemSprite的实例 3.把MenuItemSprite的实例放进Menu实例 ...

  7. Android应用Activity、Dialog、PopWindow、Toast窗体加入机制及源代码分析

    [工匠若水 http://blog.csdn.net/yanbober 转载烦请注明出处.尊重劳动成果] 1 背景 之所以写这一篇博客的原因是由于之前有写过一篇<Android应用setCont ...

  8. [UWP]创建一个进度按钮

    1. 前言 最近想要一个进度按钮. 传统上UWP上处理进度可以这样实现,首先是XAML,包括一个ProgressBar和一个按钮: <StackPanel Orientation="H ...

  9. vue UI框架

    一.pc端 element UI 饿了么UI支持vue2.x80分优点:组件的API方法.属性等封装的较为完善缺点:样式有些生硬,不够炫酷美观 N3 N3支持vue2.x70分优点:组件操作几乎都有动 ...

随机推荐

  1. dart 中的 try on catch

    catch 捕获异常 捕获了一个异常后,就停止了捕获异常过程.捕获一个异常,你就有机会去处理它: try { breedMoreLlamas(); } on OutOfLlamasException ...

  2. 文件夹上传插件webupload插件

    在Web应用系统开发中,文件上传和下载功能是非常常用的功能,今天来讲一下JavaWeb中的文件上传和下载功能的实现. 先说下要求: PC端全平台支持,要求支持Windows,Mac,Linux 支持所 ...

  3. java 整理

    类和类之间,接口和接口之间是继承:类和接口之间是实现:类只能单继承,接口可以多继承. 1.接口的出现扩展了功能. 2.接口其实就是暴漏出来的规则. 3.接口的出现降低了耦合性,即设备与设备之间实现了解 ...

  4. expr算术运算

    #!/bin/bash #expr MY_VAR1= MY_VAR2= #expr 是命令 MY_VAR3=`expr $MY_VAR1 + $MY_VAR2` MY_VAR4=`expr $MY_V ...

  5. 洛谷2320 bzoj1192 鬼谷子的钱袋

    题目链接 题意概述:把正整数n分为m个正整数,m个正整数中不允许出现复数个非1的正整数,保证所有小于n的正整数都可以用一部分正整数的和表示,并且使m尽量小. 这道题不知道为啥bzoj上没有要求输出方案 ...

  6. 几种npm install 的区别

    一个node package有两种依赖,一种是dependencies,一种是devDependencies,其中前者依赖的项该是正常运行该包时所需要的依赖项,而后者则是开发的时候需要的依赖项,像一些 ...

  7. React 如何适用less

    1.使用 create-react-app 创建的项目,默认情况下是看不到 webpack 相关的配置文件,我们需要给它暴露出来,使用下面命令即可: npm run eject 2.添加less np ...

  8. gitlab 上传代码

    #生成公钥ssh-keygen -t ed25519 -C "xxx@tianwang.com"#拷贝公钥pbcopy < ~/.ssh/id_ed25519.pub 在网页 ...

  9. 你真的懂git 吗

    Git 存储目录结构介绍 首先我们先从 Git 存储目录说起,通过 git init 创建一个空的 Git 仓库,具体操作如下图: 创建完成后进入 .git 目录,如下图所示: hooks 该目录用于 ...

  10. asp.net core 使用 Serilog

    安装NuGet包 PM> Install-Package SerilogPM> Install-Package Serilog.AspNetCorePM> Install-Packa ...