Svelte 中的 ag-grid 中的 cellRenderer 如何将行高动态设置为 CSV 字符串中的项目数?

问题描述

我在 svelte 框架中使用 ag-grid。

3 列之一显示 CSV 字符串。我使用 cellRenderer 将字符串转换为多行内容,如下所示:

        {
            field: "jobLabels",headerName: "Jobs",width: 700,cellRenderer: function(params){
                return String(params.value).split(",").join('<br/>');
            },flex: 1,resizable: true,cellStyle: {'white-space': 'normal'},cellClass: 'cell-wrap',autoHeight: true,wrapText: true,},

因此,CSV 字符串转换为多行。 (那部分有效。)但是 ag-grid 只显示足够高的行以显示每行的第一行。

autoHeight 设置无效:我认为这被忽略了,因为我定义了自己的 cellRenderer。

现在,我定义了一个计算行高的函数,但它没有被调用

    let getRowHeight = function(params) {
        let jobsArray = String(params.value).split(",");
        let jobsCount = jobsArray.length;
        return 27 + (jobsCount) * 17;
    }
</script>

<FullHeightContent title="Review jobs">
    <DataGrid {columnDeFinitions} {getRowHeight} dataSourceUrl="api/jobs" />
</FullHeightContent>

在我的 DataGrid.svelte 中,我尝试使用 getRowHeight 函数(但从未调用过),如下所示:

    export let getRowHeight;

    onMount(() => {
        console.log("mount DataGrid");

        // let the grid kNow which columns and data to use and which events to expose
        var gridOptions = {
            columnDefs: columnDeFinitions,rowModelType: "infinite",datasource: new AgGridDataSource(dataSourceUrl),defaultColDef: defaultColumnDef,singleClickEdit: true,columnTypes: columnTypes,onCellEditingStopped: handleCellEditingStopped,onCellClicked: handleCellCicked,getRowHeight: getRowHeight,};

        gridControl = new Grid(gridContainerElement,gridOptions);
    });
</script>

<div class="ag-theme-alpine grid-container" bind:this={gridContainerElement} />

因此,我在每一行上调用 getRowHeight 的尝试都失败了。我应该如何正确配置?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)