thx / rap2-delos

阿里妈妈前端团队出品的开源接口管理工具RAP第二代
http://rap2.taobao.org
MIT License
7.65k stars 1.35k forks source link

[Bug]接口页面无法完全清理多级数据结构 #813

Open stormrabbit opened 3 years ago

stormrabbit commented 3 years ago

BUG描述 接口详情页面(路由repository/editor?id=xxx&mod=yyy&itf=zzz),在编辑状态时、使用导入功能编写请求参数或响应数据后,点击垃圾桶删除属性时,无法完全清理多级数据结构。

复现步骤

对于期望 mock 数据:

 {
    "temp1":1,
    "temp2":[
        {
            "temp3":"3",
            "temp4":"4",
            "temp5":[
                {
                    "temp6":"6",
                    "temp7":"7"
                }
            ]
        },
    ]
}

打开接口页面 -> 编辑 -> 响应数据 & 导入 -> 提交 -> 点击垃圾桶删除 temp1 -> 点击垃圾桶删除 temp2 -> 保存

期望结果

对 post 请求 properties/update?itf=110223,body 中的参数为:

{
    properties: [],
    summary: {
        bodyOption: "FORM_DATA",
        posFilter: 2
    }
}

实际结果

{
    properties: [{id: 24007804, scope: "response", type: "Array", pos: 2, name: "actual_content", rule: "+1",…], // 实际有数据
    summary: {
        bodyOption: "FORM_DATA",
        posFilter: 2
    }
}

截图 image

其它可能帮助我们排查问题的环境信息

对于 src/components/editor/InterfaceEditor.tsx 文件中,handleDeleteMemoryProperty 方法(209 行)。

  handleDeleteMemoryProperty = (property: any, cb: any) => {
    const properties = [...this.state.properties]
    const index = properties.findIndex((item) => item.id === property.id)
    if (index >= 0) {
      properties.splice(index, 1)

      // 清除后代属性
      const deletedParentIds = [property.id]
      for (let index = 0; index < properties.length; index++) {
        if (deletedParentIds.indexOf(properties[index].parentId) !== -1) {
          deletedParentIds.push(properties[index].id)
          properties.splice(index--, 1)
          index = 0 // 强制从头开始查找,避免漏掉后代属性
        }
      }

      this.setState({ properties }, () => {
        cb && cb()
      })
    }
  }

建议修改为:

        if (deletedParentIds.indexOf(properties[index].parentId) !== -1) {
          deletedParentIds.push(properties[index].id)
          properties.splice(index, 1)
          index = -1 // 强制从头开始查找,避免漏掉后代属性
        }