Maximum recursive updates exceeded警告导致的接口卡住，页面崩溃问题

表现：
本地报警告：Maximum recursive updates exceeded. This means you have a reactive effect that is mutating its own dependencies and thus recursively triggering itself. Possible sources include component template, render function, updated hook or watcher source function.但可以正常运行。

布到线上后表现为刚进入页面后接口收不到，整个页面卡住，但后端那边返回信息正常。

打开性能监视器，本地会在一瞬间cpu占用率飙升100%，然后回落。线上并不会回落，直接卡死

原因：
用watch监听了一个响应式变量。请求接口信息后，该变量map操作，从而生成另一个响应式变量。
大概操作如下

        const list =oldList.value.map((clip) => {
          clip.types = []
          clip.height = clip.height*100
          return clip
        })

虽然map操作生成新数组，但直接改变原响应式中的元素，陷入了死循环

修改之后的操作

        const list =oldList.value.map((clip) => {
          const newClip = {} 
          Object.assign(newClip, clip)
          newClip.types = []
          newClip.height = clip.height*100
          return newClip
        })

结果：
本地时控制台不再报警报，性能上看cpu也不会飙升，线上也没有卡死的问题了