如何强制重新计算组件位置

[Subilan]

结构大概是这个样子

<Dlg v-model="modalOptionConfig" title="编辑选项">
    <BlockStack gap="400">
        <vue-draggable :animation="150" handle=".drag-handle" ghost-class="phantom" class="option-configs"
            v-model="choiceConfig.config.choices">
            <ChoiceOptionConfig v-for="option, i in choiceConfig.config.choices"
                v-model="choiceConfig.config.choices[i]" :key="option.id" />
        </vue-draggable>
        <Button style="width: 100%;" variant="primary" @click="addOption">添加选项</Button>
    </BlockStack>
</Dlg>

拖拽功能是正常的。问题在于，如果添加了新的选项（往choices数组push），虽然依然可以拖拽（排序也没问题），但拖拽的过程中组件的位置不正确（例如组件会瞬移到容器顶部），影响用户体验。页面加载时已经存在的选项则不受影响。

我推测这是因为一些布局的计算没有在choices数组更新的时候执行。有没有办法强制重新计算呢？或者是别的什么原因吗？

如果需要更多信息请联系我提供。

---

Dragging functionality works well. The problem is that new elements pushed to the array afterwards are teleported to some wrong position, e.g. the start of their container, when dragging. This degrades user experience.

Elements that already exist on page load are not affected.

I assume the solution is to re-compute some kind of layout information/xy coordination stuff after the array is updated. Is there any way (API) to do that? Or is there a more specific reason?

Let me know if you need further information.