🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
>[danger] 前期准备 ~~~ //html 引入 Layer 的 JS 文件和JQuery <script src='https://cdn.bootcss.com/jquery/1.8.3/jquery.min.js'></script> <script src='https://cdn.bootcss.com/layer/3.1.0/layer.js'></script> ~~~ >[danger] 基本语法 ~~~ layer.open({ 配置项:值, 配置项:值, ........ }) ~~~ >[danger] 弹窗层效果 | type值 | 说明 | | --- | --- | | 0 | 信息框 | | 1 | 页面 | | 2 | iframe框架 | | 3 | loading加载 | | 4 | tips小标签提示 | >[info] 基本格式 ~~~ $('btn').click(function(){ layer.open({ type:0, title:'提示框标题', //默认样式 //title:['提示框标题','color:white;width:100px' ], // 设置内容和样式 //title:false, type值为false时,提示标题隐藏 content:'提示框内容', //content 根据type的值有不同的类型,有html代码,dom节点,url //tpye: 4 时,conntent:['提示信息',dom节点], 可以为具体节点添加提示标签 icon:1, //icon 值为1-6,可以显示不同的小图标,icon会根据type值得类型变化 }) }); ~~~ >[danger] alert 弹窗 >[info] 基本格式 ~~~ layer.alert({ 配置项:值, 配置项:值, ........ }) //layer.alert 和layer.open 用法基本一致,区别在于layer.alert内没有type属性 ~~~ >[danger] confirm 询问框 >[info] 基本格式 ~~~ layer.confirm(content,options,function(){ 选择Yes之后执行得代码 },function(){ 选择No之后执行得代码 }) //Content:设置comfirm的弹层内容 //Options:配置基础参数 ~~~