for 循环动态显示dom

写法1：
<div style="margin-bottom: 10px" v-for="(item, index) in funcCtx.packRlt" :key="index">
<PackBomTable :prodRltDocId="item.prodRltDocId" :ref="setPackBomSchemeRef" />
</div>
 const processElRef = ref<any>(null);

// 保存炮制bom组件引用
const processEsRefs = ref<Array<any>>([]);
const setBomSchemeRef = (el: any) => {
    processEsRefs.value.push(el);
    console.log('炮制bom-refs', processEsRefs);
};
注意：在弹窗里面会滚动一直加入代码片

写法2：

//子组件

setup(props, { emit, attrs }) {
 // 向父组件注册组件的一些方法
 const { elIndex, registerCompaForm } = attrs;
  (registerCompaForm as any)(elIndex, {
    validate,
    setFieldsValue,
  });
}

//父组件

<CompanionEditForm
    :goodsVarietyId="item.goodsVarietyId"
    :item="item"
    v-for="(item, index) in arrangeData.companionList"
    :key="item.goodsVarietyId"
    @onCompanionGoods="onCompanionGoods"
    :registerCompaForm="registerCompaForm"
    :elIndex="index"
  />
  
   // 伴生组件持有
  const companionEditElActions = reactive({});
  const registerCompaForm = (index: any, elAction: any) => {
    companionEditElActions[index] = elAction;
  };
  
  
  return{
      registerCompaForm
  }