easyui datagrid 慢 ?!

这个标题估计使用 easyui 的同学都搜过吧,我也搜索、纠结了很长时间,今天在详细阅读 easyui datagrid 文档(点击这里)的时候,突然看到了一个参数(如下图):

easyui datagrid 慢 ?!_第1张图片

相信细心的同学已经激动了!是的,它就是解决问题的关键点。

描述中说明,如果不设置这个属性,将大大(不夸张啊,效果立竿见影 哈哈)减少datagrid的执行效率!

so, let's do it 。。。。。

解决方案:

  1. 去除 easyui-datagrid 的全局属性:fitColumns=“”(如果有设置的话);

  2. 给每一列添加属性:width="xx"(根据需要调整宽度值)

that's all ~ 刷新页面感受下顺滑的快感吧 o(∩_∩)o 哈哈

参考代码:

 ...... 略 ......
 
 <table id="dg" idField="id" class="easyui-datagrid" url="" pagination="true" pageSize="10" rownumbers="true"   remoteSort="true" ctrlSelect="true" data-options="onBeforeLoad: onBeforeLoad, onLoadSuccess: onLoadSuccess">
        <thead>
            <tr>
                <th field="ck" checkbox="true"></th>
                <volist name="Param_List" id="vo">
                    <th field="{$vo.name}"
                        {// 是否手动指定列宽,不指定,则使用默认值 }
                        <present name="vo.width">
                            width="{$vo.width}"
                        <else />
                            width="60"
                        </present>
                        {// 是否格式化字段输出 }
                        <present name="vo.formatter">
                               formatter="{$vo.formatter}"
                        </present>
                        {// 是否排序字段 }
                        <present name="vo.sortable">
                              sortable="true"
                        </present>
                    >{$vo.title}</th>
                </volist>
            </tr>
        </thead>
    </table><!-- end 表格数据部分 -->
    
    ...... 略 ......
  1. 上述代码基于thinkphp,可根据自己的项目环境调整,其实主要是上面提到的关键点,代码只是参考;

  2. easyui 官网无法访问是因为被墙了,可以修改自己的dns为 8.8.8.8 和 8.8.4.4,或者干脆访问中文站,这里就不提供了,可以搜一下。

  3. 实测:后台1800多条商品详情数据(33个字段),几乎是秒开,修改之前用时差不多7s左右。


你可能感兴趣的:(easyui,datagrid,慢,easyui优化,datagrid优化)