如何修复使用 WIJMO 创建 flexGrid 动态列时为同步“DOMNodeInserted”添加的[弃用]监听器？

Question

<wjGrid.FlexGrid
    id='grid-main-content'
    initialized={initializeGrid.bind(this)}
    itemsSource={this.props.dataForGrid}
    allowMerging="All"
    autoGenerateColumns={false}
    headersVisibility='Column' //hide column header as row header in wijmo flexgrid
    isReadOnly={true} 
    allowSorting={false} 
    selectionMode='None'
    allowResizing='None'
    allowDragging='None'
    frozenColumns={4}>
    <wjGrid.FlexGridColumn
    key={0} 
    header=''
    binding=''
    minWidth={20} width={130}
    >
    </wjGrid.FlexGridColumn>
    <wjGrid.FlexGridColumn
    key={1} 
    header=''
    binding=''
    minWidth={20} width={100}
    >
    </wjGrid.FlexGridColumn>
    <wjGrid.FlexGridColumn
    key={2} 
    header=''
    binding=''
    minWidth={20}  width={100}
    >
    </wjGrid.FlexGridColumn>
    <wjGrid.FlexGridColumn
    key={3} 
    header=''
    binding=''
    minWidth={3} width={3}
    cssClass='padding-0'
    >
    </wjGrid.FlexGridColumn>
    {this.generateColumn(this.props.arrayHeader)}
</wjGrid.FlexGrid>



 generateColumn = (params) => {
    let arrayColumn = [];
        // create column header base on each item
        for (let i = 0; i < paramslength; i++) {
            resultColumn.push(<wjGrid.FlexGridColumn
                key={i+4} 
                header={}
                name={ }
                binding={'' + i}
                minWidth={160} width="*">
            </wjGrid.FlexGridColumn>)
        }
    }
    return arrayColumn;
}

/**
 * initialize grid
 * @param {wijmo grid} grid 
 */
export function initializeGrid(grid) {

    grid.rows.defaultSize = 16;
    grid.columnHeaders.rows.defaultSize = 18;
    // add three extra column header rows
    var hr = new wjcGrid.Row();
    grid.columnHeaders.rows.push(hr);
    grid.columnHeaders.rows[0].allowMerging = true;
    grid.columnHeaders.rows[0].align = 'center';
    grid.columnHeaders.rows[1].backgroundColor = '#182e38';
    grid.refresh(true);
}

使用 FlexGrid 列组件会导致 DOMNodeInserted 警告

文件类型

限制

发生环境

出现在 Angular 模块、Vue 模块、React 模块和 Web Components 模块中

情况

有一个解决方法

细节

[弃用] 为同步“DOMNodeInserted”DOM 突变事件添加了侦听器。此事件类型已弃用 ()，并且正在努力将其从此浏览器中删除。使用此事件侦听器将导致今天的性能问题，并代表未来不兼容的风险。考虑使用 MutationObserver 代替。

我尝试在函数初始化设置网格中渲染列，但列是动态的并且网格不会重新渲染。

我使用“@grapecity/wijmo.all”：“^5.20202.732”。

我可以做什么来修复它？请帮助我！

Answer 1

我有同样的问题，我正在寻找答案..(T_T)