最新版,数据表格,右固定列不显示

提问 未结
22 292
Joshua
Joshua 2018-10-6
悬赏:20飞吻
版本:layui 2.4.3 浏览器:
今天升级了最新版的layui,但是发现这个数据表格的固定列有问题,本来定位在右侧的操作栏,并没有按照设定显示,但是在我f12的时候,它又好了,但是刷新又不行了,后来观察发现,刷新并没有执行去除layui-hide样式,测试了很久,也不知道啥问题,不知道是不是只有我有这个问题。 @贤心

回帖
  • 这个就我的经验的话是因为你页面的结构影响的,你看下你resize的时候是不是会有其他容器的变化,特别注意的是左侧菜单的逻辑,是否有根据屏幕大小做隐藏还有显示的,使用layui的admin的产品就遇到这个问题,形成的原因就是因为在resize的时候不单单只有table会变化,左侧菜单也会,但是左侧菜单它显示隐藏是有一个动作的,而且你也没办法规定resize的时候要等左侧的相应完成了table再相应,他们应该是无序几乎同时响应的,这个时候table的调整就会出现一种情况,那就是table在调整的时候实际左侧的菜单宽度没有或者比较小,那么显然table的宽度就比较大,这时候table自适应好了,关键是左侧的菜单它不是没有,它根据当前窗口大小,如果足够它就显示出来了,就造成了table调整之后实际的宽度跟它在调整时候是有偏差的,这个是形成的最主要一个原因,但是如果你可能以前的版本调整之后table不会没有右固定列,顶多就是有横向滚动条,即使你设置了一些列是自动宽度铺满表格,然后表格也足够宽度的情况下。但是新版本右固定列“失效了”,如果是这个情况的话很可能是因为table你设置右固定,它的逻辑不是说一定就是右固定,而是在需要的时候,什么是需要的时候呢,就是说内容的宽度大于表格的宽度的时候,刚刚好会隐藏掉,如果内容都没铺满这个必然会隐藏掉,因为没必要,但是“问题”处在于零界点--“刚刚好”的时候。
    也就是说出现你这个情况的原因很可能是因为resize的时候因为其他的容器也会调整,影响到了table的容器的宽度,导致table在自适应的时候宽度跟最后的宽度不一致的问题,而且在计算的时候刚好表格的宽度足够显示所有的内容的时候右固定加了隐藏了,就变成你看到的右固定“失效”的问题,但是实际不是失效,它其实很好的完成了它的工作了,主要解决的是前面那个resize的时候容器之间的关系问题。
    0 回复
  • Joshua
    2018-10-6
    @岁月小偷 我这个之前没问题,而且现在有些页面正常,有些页面不正常,我是找不到原因,都是一个单独的iframe页面,我可以断定是个bug。因为我f12,弹出调式工具的时候,页面又正常了,但是我刷新又不正常了,这时候我拉动调试工具的高低,页面又好了,还有一种,就是我放大浏览器窗口,就正常了,我估计是他们计算这个有误吧,不然怎么会这样。在我拉动调式工具的时候,页面也并未出现滚动条,如果这不是bug怎么之前没这个问题。
    0 回复
  • @Joshua 那这个就不太确定了,如果每个table所在的tab都是一个iframe的话应该不会出现这个状态,我之前说的都是单页面出现的情况因为单页面中tab里面不是iframe,都是在同一个window下,改变局部的宽度是不会再触发tablerender的时候添加的resize监听,但是如果每个都是iframe的话只要窗口大小变动都会触发各自的监听的。
    按f12应该dock的side应该是在页面浏览器内容,这样会改变窗口的大小,所以按了f12或者调整f12的大小都会再次触发resize调整。单页面的话,如果这时候的调整其他的容器不会有什么变化的话,table的右固定也就出来了,但是你又都是iframe的,这个应该是一开始就不会出现这个问题额,这个也不知道什么原因了。当然table.js里面resize的时候的几个顺序感觉也是有点点问题,应该是设置宽高,然后设置列宽,最后再打滚动条补丁,它的顺序后面两个是反着来的,可以尝试调整一下试试看,不过感觉应该也不是这个的问题。


    0 回复
  • Joshua
    2018-10-6
    @岁月小偷 先舍弃新版,等待下一版再看看,我感觉是有问题。
    0 回复
  • Freedom丶
    2018-10-8
    这问题我也有,表格列显示不全,但是f12又好了,只是某些页面会有这问题,其他都好着
    0 回复
  • Joshua
    2018-10-8
    @Freedom丶 知道是什么原因吗?你的解决了?
    0 回复
  • @Joshua 我也遇到这样的问题,问题思路跟岁月大佬分析的很像,小尺寸会固定,中尺寸又不固定,大尺寸又不固定,浏览器界面尺寸动下,它又会固定,layui2.几的时候都没遇到这样的,更新版本后就会这样,目前解决方法就是表格的宽度给他定义下,很大几率就没问题,不过中尺寸测试时ok,1920下感觉也会出现不固定现象,看作者咋说了
    0 回复
  • Joshua
    2018-10-8
    @八路队长 那就是bug,等吧,不解决这个,没法用新版。
    0 回复
  • @Joshua 你试下,表格开启最小的表格,表格内的按钮设置为最小,你会发现,按钮的高度大于表格的高度,反正是没看到作者的回复。
    0 回复
  • Joshua
    2018-10-8
    @八路队长 没空折腾了。
    0 回复
  • Freedom丶
    2018-10-9
    @Joshua 我给表格加上url,也就是后台数据莫名其妙就好了,显示很正常,只要把url注释掉,立马就显示不正常了
    0 回复
  • Joshua
    2018-10-9
    @Freedom丶 说明是bug呗
    0 回复
  • @Joshua 调宽度,撑到一定的时候就会固定
    0 回复
  • Joshua
    2018-10-10
    @八路队长 试了,不行,何必呢,没必要折腾
    0 回复
  • @Joshua ,done : function () {

    $('.layui-table-fixed-r').removeClass('layui-hide');
    }

    加载js表格数据分页下面。
    0 回复
  • @Joshua
    以上省略。。你应该会看的懂!老铁
            ,limits:[20,40,80,160]
    ,id:"LAY-CustomerEnquiries"//后续赋值可以用到
    ,text:{none: '抱歉!未找到相关的数据。'}
    ,done : function () {
    $('.layui-table-fixed-r').removeClass('layui-hide');
    }
    0 回复
  • @Joshua
            ,done : function () {
    $(window).resize();
    $('.layui-table-fixed-r').removeClass('layui-hide');
    }
    优化下代码,原先的会导致高不对齐
    0 回复
  • Joshua
    2018-10-30
    @八路队长 加入你的代码,就没问题了?
    0 回复
  • @Joshua 你可以试下,我是这样解决了
    0 回复
  • Joshua
    2018-10-30
    @八路队长 你这个是删除了隐藏的样式,但终归不是办法,这个还是属于bug,估计是不会解决的了,新版也一样是有这个问题。
    0 回复
  • @Joshua bug这个我只能说了,没啥回复的,@ 贤心,也没回复。目前项目的情况,我是这样解决了,暂时解决下问题,不然卡着不可能不用表格吧
    0 回复
  • Joshua
    2018-10-30
    @八路队长 嗯嗯,也可以的呢。
    0 回复