在vue3项目中编辑的时候，解决对话框里边的数据和列表中的数据联动了。深复制

//分析原因是从列表中拿到的数据直接复制去修改就涉及到堆里变的内容是一样的，直接复制其实只是把引用地址赋值给变量了，解决方法是 浅复制和深复制。



<!-- 审批流程管理 -->
<template>
  <div style="float: left; width: 250px;background: #fff;height: calc(100vh - 174px);">
    <!-- <Tree name="审批流程列表" :Tree="Treedata"/> -->
    <Tree name="审批流程列表"  :Tree="Treedata" @childfun="Treefun"/>
  </div>

  <div   ref="bodiv" style="float: left; width: calc(100% - 260px);margin-left: 10px;background: #fff;height:  calc(100vh - 174px);">
    <div style="font-size: 14px; font-weight: 600; height: 50px; border-bottom: 1px solid #eee;line-height: 50px; padding-left: 10px;">  
      审批流程设置 - 提审合同范本
    </div>
        <div ref="elstep">
              <el-row    style="font-size: 14px; width: calc(100% - 20px);margin-top: 10px;padding: 10px 0px; margin-left: 10px;border: 1px solid #e0e0e0 ; line-height: 30px;">
                <el-col :span="24">
                    <el-steps :active="100" align-center  >
                          <el-step :title="item.nodeName"  v-for="(item , index) in tableData"  :key="index">
                            <template v-slot:title>
                                  <span style="color: #444;">
                                    {
   {
    item.nodeName }}
                                  </span>   
                              
                            </template>
                            <template v-slot:description>
                                <p v-for="it in item.list" :key="it" style="color: #999;">
                                  <span v-if="it.type == 1">
                                    {
   {
    it.receiverPostNames }}
                                  </span>  
                                  <span v-else>
                                    {
   {
    getIntDictOptions('sl_system_person_type').find(its => its.value === it.receiverProject)?.label }}
                                  </span>   
                                </p>
                              
                            </template>

                          </el-step>
                          <!-- <el-step title="Step 2" description="Some description" />
                          <el-step title="Step 3" description="Some description" /> -->
                    </el-steps>

                  
                </el-col>
              </el-row>
        </div>
    <el-table :data="tableData"  style="width: calc(100% - 20px); margin-top: 10px; margin-left: 10px; overflow: auto;"  :style="{height:tableheight+'px'}">
       
        <el-table-column show-overflow-tooltip="true" prop="name" width="150" type="index" label="排序"  />
        <el-table-column show-overflow-tooltip="true" prop="nodeName" label="节点名称" />
        <el-table-column show-overflow-tooltip="true" prop="list" label="节点人员" >
          <template #default="scope" >
                <div v-for="(item ,inx ) in scope.row?.list"  :key="item" style="line-height: 30px;" >
                  <div v-if="inx <  scope.row?.list.length - 1" style="border-bottom: 1px solid #F1F1F1;">
                    <div v-if="item.type == 1" >
                      {
   {
    item.receiverPostNames }}
                    </div>  
                    <div v-else>
                      {
   {
    getIntDictOptions('sl_system_person_type').find(it => it.value === item.receiverProject)?.label }}
                      <!-- {
   {
    item.receiverProject }} -->
                    </div> 
                </div>
                <div v-else>
                    <div v-if="item.type == 1" >
                      {
   {
    item.receiverPostNames }}
                    </div>  
                    <div v-else>
                      {
   {
    getIntDictOptions('sl_system_person_type').find(it => it.value === item.receiverProject)?.label }}
                      <!-- {
   {
    item.receiverProject }} -->
                    </div> 
                </div>
              </div>
          </template>
        </el-table-column>  
        <el-table-column show-overflow-tooltip="true" prop="name" label="人员类型" >
          <template #default="scope" >
                <div v-for="(it , inx ) in scope.row.list"  :key="it"  style="line-height: 30px;">
                  <div v-if="inx <  scope.row?.list.length - 1" style="border-bottom: 1px solid #F1F1F1;">
                     {
   {
    getIntDictOptions('sl_system_operate_type').find(item => item.value === it.type)?.label }}
                  </div>
                   <div v-else>{
   {
    getIntDictOptions('sl_system_operate_type').find(item => item.value === it.type)?.label }}</div>
                </div>
          </template>
        </el-table-column>
        <el-table-column show-overflow-tooltip="true" prop="date" label="操作" width="150" >
          <template  #default="scope">
            <span v-if="scope.row.nodeName == '发起人'" style="color: #1890FF;cursor: pointer;" @click="bjfqr(scope.row.id)" >编辑&emsp;&emsp;</span> 
            <span v-if="scope.row.nodeName != '完成'&&scope.row.nodeName != '发起人'" style="color: #1890FF;cursor: pointer;" @click="xgjdfun(scope.row)" >编辑&emsp;&emsp;</span> 
            <span v-if="scope.row.nodeName != '完成'&&scope.row.nodeName != '发起人'" style="color: #1890FF;cursor: pointer;" @click="delfun(scope.row)">&emsp;删除&emsp;</span>
          </template>
        </el-table-column>
      </el-table>

    <el-row>
    <el-col :span="24">
      <el-button type="primary" plain style="width: calc(100% - 20px); margin-left: 10px; margin-top: 10px;border: 1px dashed;" @click="newfun()">+&emsp;新增节点</el-button>
    </el-col>
    </el-row>
  </div>
  
  
  <el-dialog
    v-model="dialognew"
    title="新增节点"
    width="30%" >

    <el-row style="font-size: 14px; width: calc(100% - 20px);margin-left: 10px; margin-top: 10px;border: 1px solid #e0e0e0 ; line-height: 50px;">
      <el-col :span="6">&emsp;*节点名称:</el-col>
      <el-col :span="18"> 
        <el-input v-model="jdpar.nodeName" placeholder="请输入节点名称"  style=" width: calc(100% - 40px); margin-left: 8px; " size="small"/>
      </el-col>
    </el-row>

    <el-row style="font-size: 14px; width: calc(100% - 20px);margin-left: 10px; margin-top: 10px;border: 1px solid #e0e0e0 ; line-height: 50px;">
      <el-col :span="6">&emsp;*人员类型:</el-col>
      <el-col :span="18"> 
        <el-select v-model="jdpar.approversCreateReqVOList[0].type" class="m-2" placeholder="指定岗位" size="small" @change="zdgwfun">
          <el-option
            v-for="item in getIntDictOptions('sl_system_operate_type')"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-col>
      <el-col :span="6">&emsp;*节点人员:</el-col>
      <el-col :span="6" v-show="iszdgw == true">