Angular Material 拖放 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 - 但是，这是为了支持混合方向（带环绕的 flexbox）。

非常感谢任何帮助。

Answer 1

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