使用Underscore更新嵌套JSON时如何避免原有内容丢失？

我看了你的代码，问题出在这一行：

item.contentItems = updatedContentItem ;

你原来的contentItems是一个数组（从你的JSON结构能看到它包含nested 1和nested 2两个元素），但你这里直接把整个数组替换成了单个updatedContentItem对象，这就导致原来数组里的其他元素全部被清空了。

要解决这个问题，你需要找到数组中要更新的具体元素，修改它的属性，而不是替换整个数组。下面是具体的修改方案：

步骤1：定位要更新的contentItem元素 #

首先，你需要在contentItems数组里找到你要更新的那一项。因为你的数据里没有给contentItem加唯一id，暂时可以通过name来匹配（建议后续给每个contentItem添加唯一id，这样匹配会更可靠）。

如果你的表单里没有存储原始的contentItem名称，建议加个隐藏字段来保存，避免用户修改名称后找不到要更新的项：

<!-- 在你的编辑表单里添加这个隐藏字段，赋值为要更新的原始name -->
<input type="hidden" id="originalContentItemName" value="nested 1">

步骤2：修改更新逻辑 #

把你原来替换数组的代码，改成遍历contentItems并更新对应项的逻辑：

_.each(jsonData.itemsList, function (item) {
  if (item.id === resourceId) {
    item.contentName = updatedContentName;
    
    // 获取要更新的原始名称（从隐藏字段取）
    var originalContentItemName = $("#editResourceItemForm input#originalContentItemName").val().trim();
    // 遍历contentItems数组，找到目标项
    _.each(item.contentItems, function(contentItem, index) {
      if (contentItem.name.trim() === originalContentItemName) {
        // 直接修改现有对象的属性，保留数组其他元素
        contentItem.name = $("#editResourceItemForm input#contentItemName").val();
        contentItem.description = CKEDITOR.instances.contentItemDescription.getData();
      }
    });
  }
});

为什么这样能解决问题？ #

原来的代码是直接把contentItems数组整个替换成单个对象，相当于把[item1, item2]变成了item1，自然丢失了item2。而修改后的逻辑是在原数组里找到要更新的元素，只修改它的属性，数组里的其他元素会被完整保留。

如果之后你需要新增contentItem，才用item.contentItems.push(updatedContentItem)来添加，而不是替换整个数组。

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