zoukankan      html  css  js  c++  java
  • 在vue中引入layer弹框的简易方法

    1.安装layer插件

    npm i --save layui-layer

    2、在main.js中引入

    import layer from "layui-layer";

    3、然后就可以在各个组件中使用layer了

    实例:

            layer.confirm('您是如何看待前端开发?', {
                btn: ['重要','奇葩'] //按钮
            }, function(){
                layer.msg('的确很重要', {icon: 1});
            }, function(){
                layer.msg('也可以这样', {
                    time: 20000, //20s后自动关闭
                    btn: ['明白了', '知道了']
                });
            });

    4、在项目中使用loading页

            var loading= layer.load(3, {//请求未成功时出现loading页 ,3代表一中效果
               shade: [0.1,'#fff'] //0.1透明度的白色背景
            });
    
            layer.close(loading);   //停止loading效果 
            var confirm=layer.confirm('删除后,作者所选择【单位序号】数据将被清空,需要重新选择,是否确定?', {
                    btn: ['确定','取消'] //按钮
                }, function(){
                    self.companyInfoArr.splice(index,1);
                    layer.close(confirm);
                },function(){
            });

    5、1.5s后消失的提示框

    layer.msg("操作成功!",{icon:1,time:1500});//提示框

    6、询问框

              layer.confirm('是否已完成支付?', {//layer弹窗插件
                  title:"信息",
                  closeBtn: 0,
                  btn: ['付款成功','付款失败'] //按钮
              }, function(){
                  self.completePay(id);//查询是否支付
                  layer.closeAll();
              },function(){
                  //...
              });

    参考---https://www.cnblogs.com/fqh123/p/10848883.html

  • 相关阅读:
    leetcode
    面试知识点
    关于flock文件锁的阻塞与非阻塞
    cetos7 安装telnet
    github 获取 token
    windows安装composer
    编码问题
    RabbitMQ 关键词解释
    windows下安装rabbitmq以及php扩展amqp
    windows下安装oracle客户端和php扩展
  • 原文地址:https://www.cnblogs.com/pwindy/p/14580957.html
Copyright © 2011-2022 走看看