导入layui没报错但格式不显示_关于layui踩过的坑

最近在做二手车的后台系统搭建,前端使用的框架是 layui,现在我对layui进行一下简单的记录。

layui兼容Ie7以上所有浏览器,内置了很多好用的模块,包括弹框(div,简单的按钮组,iframe,msg)分页,表格,表单,文件上传,日期等模块,而模块的引入也十分人性化,使用layui.use引入相应的所需模块,类似于require.js

layui.use(['layer', 'form'], function(){

var layer = layui.layer

,form = layui.form;

});

今天总结一下在使用layui过程中遇到的问题

1.内置模块功能不能用 一定要用use引入 你要使用的组建,并在内部函数中声明一次。

layui.use(['table','laypage'], function(){

var table = layui.table, 表格

$= layui.jquery, 内置jquery

form = layui.form, 表单

laypage = layui.laypage; 分页

var beginTime,endTime;

var laydate = layui.laydate; 日期组建

var limit=10,page=1;

//日期组建的

laydate.render({

elem: '#date',

range: true

,ready: function(date){

// console.log(date); //得到初始的日期时间对象:{year: 2017, month: 8, date: 18, hours: 0, minutes: 0, seconds: 0}

}

,done: function(value, date, endDate){

$('#date').css('width',200);

var arrTime=value.split(' - ');

beginTime=arrTime[0];

endTime=arrTime[1]

}

});

});

2019-09-23

layui内容弹框模块 layer ,当页面 引入其他模块的时候 由于依赖关系 会自动引入,当页面 没有引入其他模块 ,而需使用layer的时候 ,需要 layui.use('layer') 即可使用

2.layui中 slect form表单元素 不美化显现的问题

1.layui中美化的表单元素 在渲染完成要添加 form.render()

$.each($('#classId option'),function (i, v) {

if($(v).val()==data.id){

$(v).attr("selected","selected")

}

})

form.render()

2.渲染之后还是没有,检查一下html结构 是否在父级元素上有layui-form的类名

商品单位:

3.layui select 多选框

官方文档并没有 select多选框 不过大牛们利用layui改造了很多select的多选框  社区有一些介绍 戳这里  我用的是select多选v3版本 有一些问题 但是对于目前的功能比较适合 地址戳这里 这里对select v.3的功能介绍展示的很全 以后用到可以直接访问

select.v4地址 戳这里

接下来 我记录一下 我的使用  效果图如下

导入layui没报错但格式不显示_关于layui踩过的坑_第1张图片

(1)现引入资源 刚附上的链接里 拿来直接用的资源

导入layui没报错但格式不显示_关于layui踩过的坑_第2张图片

(2)在页面引入 js

39dbeae1eb8f8741af916b34a6d23fb3.png

还有一种方式 是将js引入到layui的资源js中

和其他内置模块一样 引入模块名 并且调用 但是这个需要配置一下路径

layui.use(['table','upload',

你可能感兴趣的:(导入layui没报错但格式不显示_关于layui踩过的坑)