Question

我正在尝试使用vaadin网格元素。需要使用动态数据填充它。即列名和计数可以改变。

尝试使用如下所示。使用模板，尝试重复col元素和标题元素。从而动态创建网格。

它会显示错误消息：

Uncaught Class $ S69

（匿名函数）@ vaadin-grid.min.js：57

是否可以在vaadin网格中加载动态数据（其中列名和计数可以动态更改）。如果是，那么请指导如何实现它？如果您需要我提供更多信息，请告诉我。

<vaadin-grid id='grid' selection-mode="multi" size="1000">
                  <table>
                    <colgroup>
                        <template is="dom-repeat" items="{{columnNames}}" as="columnName">
                            <col name='{{columnName}}'>
                        </template>
                    </colgroup>
                    <thead>
                      <tr>
                          <template is="dom-repeat" items="{{columnNames}}" as="columnName">
                              <th>{{columnName}}</th>
                          </template>
                      </tr>
                    </thead>
                  </table>
                </vaadin-grid>


_featureTableDataChanged: function(data){
                if(this.isReady){
                    this.convertToJSObj(data);
                    this.$.grid.items = this.jsDataObjArr;
                }
            },

            convertToJSObj: function(data){
                this.columnNames = data[0];
                var actualData = data.splice(1, data.length);

                for(var rowIndex in actualData){
                    var columnIndex = 0;
                    var rowObj = {};

                    for(var columnName in this.columnNames){
                        rowObj[this.columnNames[columnName]] = actualData[rowIndex][columnIndex];
                        columnIndex++;
                    }

                    this.jsDataObjArr.push(rowObj);
                }
            }

Vaadin网格动态数据显示

0 个答案: