table 列重新排序的自定义函数 --> 更改基础 table 模型

Question

我使用 SheetJS 将 excel sheet 上传到 ui.table。上传时，我将技术 ID 添加到我的列名称中，稍后我将在我的项目中需要它。这就是我添加技术 ID 的方式：

getColumnNames: function(worksheet, aData) {
        var firstRow = aData[0];
        var oColumns = [];
        var cells = Object.keys(worksheet);
        for (var i = 0; i < Object.keys(firstRow).length; i++) {            
            var columnName = Object.keys(firstRow)[i];
            var technicalName = "COL" + ('0' + (i+1)).slice(-2);
            oColumns.push({
                columnId: columnName,
                technicalId: technicalName
            });
        }
    return oColumns;
},

创建模型时，我将 columnId 和 technicalId 绑定到每一列。

我的用户应该可以选择重新排序 table 列，以便映射到另一个 table。（这里的上下文不是很相关）所以基本上在我上传的 table 下面还有另一个 table 并且用户应该能够重新排序 "uploadTable" 的列以将它们与 table 下面。

现在为了进行正确的映射，我的技术 ID 必须在重新排序完成后进行调整。因此，我想添加一个在用户单击 "refresh" 按钮后执行的功能。

此功能应调整技术columnNames。 --> 例如数据已上传，位置 1 上的列具有技术 ID "COL01" 现在它被拖到位置 2 --> 技术 ID 应更改为 COL02，反之亦然。

我相信，唯一的方法是访问 table 的 DomRef，因为这是唯一存储实际当前 table 结构的地方，但我不是完全确定我将如何进行。

我的重新排序功能目前只获取数据：

onReorder : function() {
    var table = this.getView().byId("uploadData");
    var currentStructre = table.getDomRef();
},

如有任何提示，我将不胜感激。如果有什么不清楚的，我很乐意解释！

Answer 1

sap.ui.table.Table 允许通过拖放对其列进行重新排序，然后触发事件 columnMove。

可以使用如下方法跟踪和更新一些序列标签（例如 ID）：

记住 id（例如列标签作为 id）：

ids = oTable.getColumns().map(oColumn => oColumn.getAggregation('label').getText())

更新 ID：

oTable.attachColumnMove(function(oEvent) {
  var from = oEvent.getParameter('column').getIndex();
  var to = oEvent.getParameter('newPos');
  var name = names.splice(from, 1);
  names.splice(to, 0, name);
  // Then write new ids to model;
})

table 列重新排序的自定义函数 --> 更改基础 table 模型

Custom function on table column reordering --> change underlying table model

javascript

xml

dom

sapui5

sheetjs