Vue.js Vue列表移动转换仅在重新排序时起作用，但在拼接时不起作用

我有一个Vue.js应用程序（使用Vue 2和Vue 3进行测试），它显示了

过渡组中的项目列表，该过渡组具有淡入淡出效果，并且还应该应用一个。任何时候对项目进行重新排序（即在另一个项目之前移动之前的项目），都会应用移动转换，但如果使用
拼接
移除项目，并且其他项目保持相同顺序，则移动转换不会应用，移除后的项目会立即卡入到位。下面是一个简单的例子：


newvue({
el:“#应用程序”，
数据：（）=>({
名单：[1,2,3]
}),
方法：{
重新排序（）{
this.list.unshift（this.list[this.list.length-1]）
this.list.splice（this.list.length-1,1）
},
删除（）{
此.列表.拼接（1，1）
}
}
})
按钮{
显示：块；
}
李{
过渡：0.2s；
}
.v-enter-active、.v-LEFT-active{
转变：不透明度。5s；
}
.v-enter、.v-left-to{
不透明度：0；
}

重新排序
删除中间项
{{item}
这是我在堆栈溢出中的第一个答案，如果我的答案不准确，请在advanced中道歉

从文档中，我通过将position absolute添加到class.v-leave-active来实现它。我还修改了li过渡持续时间以匹配不透明度过渡时间

我希望有帮助


newvue({
el:“#应用程序”，
数据：（）=>({
名单：[1,2,3]
}),
方法：{
重新排序（）{
this.list.unshift（this.list[this.list.length-1]）
this.list.splice（this.list.length-1,1）
},
删除（）{
此.列表.拼接（1，1）
}
}
})
按钮{
显示：块；
}
李{
过渡：0.5s；
}
.v-enter-active、.v-LEFT-active{
转变：不透明度。5s；
}
.v-离开-激活{
位置：绝对位置；
}
.v-enter、.v-left-to{
不透明度：0；
}

重新排序
删除中间项
{{item}