如何在SAPUI5表格中删除行（续添行功能问题）

嘿，我看到你遇到了删除行后数据又自动恢复的问题，这是因为你直接操作模型底层的oData对象，再加refresh(true)强制拉取原始数据源导致的。来给你一个靠谱的解决方案：

问题根源 #

你之前的代码直接修改this.getView().getModel("invoice").oData属于绕过模型标准API的底层操作，模型不会感知到这个数据变更。而且refresh(true)会强制模型从初始数据源（比如你的模拟服务器或初始JSON数据）重新加载所有内容，所以你删掉的行自然又回来了。

正确的删除实现 #

SAPUI5的JSONModel提供了标准的remove方法，能安全删除数据并自动同步视图。修改你的deleteRow函数如下：

deleteRow: function(oArg) {
  // 获取删除按钮所在行的绑定上下文
  const oBindingContext = oArg.getSource().getBindingContext("invoice");
  if (!oBindingContext) {
    return; // 没有绑定上下文直接返回，避免报错
  }
  
  const oInvoiceModel = this.getView().getModel("invoice");
  // 调用模型的remove方法删除对应路径的数据
  oInvoiceModel.remove(oBindingContext.getPath());
}

为什么这个方法有效 #

• getBindingContext("invoice")：拿到删除按钮所在行对应的模型数据上下文，包含该行数据在模型中的完整路径（比如/Invoices/2）。
• oInvoiceModel.remove(path)：这是模型提供的官方删除API，它会：
  1. 从模型的数据结构中彻底移除对应条目
  2. 自动触发模型的变更事件，通知视图实时更新，不需要手动调用refresh
  3. 数据变更会持久保存在模型中，不会因为刷新操作丢失

额外提示（如果用ODataModel连接后端） #

如果你后续切换到ODataModel对接后端服务，代码逻辑类似，但remove是异步操作，需要处理成功/失败回调：

deleteRow: function(oArg) {
  const oBindingContext = oArg.getSource().getBindingContext("invoice");
  if (!oBindingContext) {
    return;
  }
  
  const oInvoiceModel = this.getView().getModel("invoice");
  oInvoiceModel.remove(oBindingContext.getPath(), {
    success: () => {
      sap.m.MessageToast.show("行已成功删除");
    },
    error: (oError) => {
      sap.m.MessageBox.error("删除失败: " + oError.message);
    }
  });
}

不过从当前你的代码来看，用的是本地JSON模型，第一个版本的代码就完全能解决问题了。

内容的提问来源于stack exchange，提问作者Iakovos