lauiui はテーブル内のすべてのデータをエクスポートします

layui（同音異義語：UI風）は、独自のモジュール仕様で書かれたフロントエンドUIフレームワークで、ネイティブHTML/CSS/JSの書き方や構成形式に準拠しています。箱の。

layui に付属のエクスポート テーブルでは、現在のページのみをエクスポートできます。現在のページにすべてのデータが含まれている場合は、すべてのデータをエクスポートすることになるので、エクスポート イベントには別のリクエストが定義されており、このリクエストがトリガーされると、バックグラウンドでデータをクエリするときに、受信したページと制限に従ってクエリを実行するのではなく、すべてをクエリすることで、すべてのデータのエクスポートが実現されます。

ページ コード:

<!--导出按钮 或其他触发事件-->
<button class="export">导出报表</button>

<!--导出表 不展示-->
<div style="display: none;">
    <table id="data_export">
    </table>
</div>

layui.use(['form', 'table', 'layer'], function () {
        var table = layui.table,
            form = layui.form,
            layer = layui.layer；
        //导出表格
        var ins1 = table.render({
            elem: '#data_export',
            url: "url", //数据接口
            method: 'post',
            title: '导出表的表名',
            where: {
                mycode: "all"
            },
            limit: 10,
            cols: [[
                {field: 'id', title: 'ID'},
                {field: 'name', title: '名称'},
            ]],
            done: function (res, curr, count) {
                exportData = res.data;
            }
        });
        //导出按钮
        $(".export").click(function () {
            table.exportFile(ins1.config.id, exportData, 'xls');
        });
    })

バックグラウンド処理:

if ($mycode) {    $data = M('mysql')->where($where)->select();  
    echo json_encode(['code' => 0, 'msg' => "", 'data' => $data]);                     
}

最適化: 対応するコードは上記の 2 番目の JS コードです:

//导出改为单独的事件，每次点击导出才会执行
    $(".export").click(function(){
        var ins1=table.render({
            elem: '#data_export',
            url: "url", //数据接口
            method: 'post',
            title: '表名',
            where: {
                mycode: "all"
            },
            limit: 10,
            cols: [[
                {field: 'id', title: 'ID'},
                {field: 'name', title: '名字'},
            ]],
            done: function (res, curr, count) {
                exportData=res.data;
                table.exportFile(ins1.config.id,exportData, 'xls');
            }
        });
    })

は実際には table です。あまり変更が無いように見えますが本質は変わっており、以前はページに入った時に非表示のエクスポートテーブルを読み込む方法でした。

これで、非表示のエクスポート テーブルは、エクスポートがクリックされた場合にのみレンダリングされます。エクスポート テーブルに多くのコンテンツが含まれている場合、ユーザーは、エクスポート速度が遅い方が妥当であり、ページの読み込みが遅いよりもはるかに優れていると考えるでしょう。スピード。

layui 関連の知識については、layui フレームワーク に注目してください。

以上がlauiui はテーブル内のすべてのデータをエクスポートしますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。