Angular Material Drag and Drop flexbox 大小在放置时丢失

Question

我正在尝试使用 Angular Material CDK 拖放功能将拖放功能添加到我的列表中。但是，当我放下一个项目时，它的 flexbox 对齐会丢失并且显示不同。

顶部是在它被丢弃之后，底部是之前。

Stackblitz to demonstrate the problem

我发现了几个可能相关的问题：

• https://github.com/angular/components/issues/13288 - 但是，这似乎只是为了预览该项目。
• https://github.com/angular/components/issues/13372 - 但是，这是用于混合方向支持（带有 wrap 的 flexbox）。

非常感谢任何帮助。

Answer 1

问题是由于 cdk 拖放更新了行的显示样式。手动将 display: flex 添加到您的 css 中，以便为类 cdk-drop-list 解决问题。