fineui/demo/js/core/abstract/demo.grid_view.js

import { shortcut, Widget, createWidget } from "@/core";

@shortcut()
export class Func extends Widget {
    static xtype = "demo.grid_view";

    props = { baseCls: "demo-func" };

    render() {
        const items = [];
        const rowCount = 10000,
            columnCount = 100;
        for (let i = 0; i < rowCount; i++) {
            items[i] = [];
            for (let j = 0; j < columnCount; j++) {
                items[i][j] = {
                    type: "bi.label",
                    text: `${i}-${j}`,
                };
            }
        }
        const grid = createWidget({
            type: "bi.grid_view",
            width: 400,
            height: 300,
            estimatedRowSize: 30,
            estimatedColumnSize: 100,
            items,
            scrollTop: 100,
            rowHeightGetter() {
                return 30;
            },
            columnWidthGetter() {
                return 100;
            },
        });
        createWidget({
            type: "bi.absolute",
            element: this,
            items: [
                {
                    el: {
                        type: "bi.grid",
                        columns: 1,
                        rows: 1,
                        items: [
                            {
                                column: 0,
                                row: 0,
                                el: grid,
                            }
                        ],
                    },
                    left: 10,
                    right: 10,
                    top: 10,
                    bottom: 10,
                }
            ],
        });
    }
}