PrimeNG 芯片溢出行为

【问题标题】：PrimeNG Chips overflow behaviourPrimeNG 芯片溢出行为
【发布时间】：2020-12-09 11:13:31
【问题描述】：

当<p-chips> 组件中有太多“筹码”无法容纳时，它会开始水平拉伸组件，直到它离开页面边缘。我希望它垂直扩展，并换行到下一行（就像材质 UI 一样）。

似乎没有任何选项可以控制溢出行为，如果我将组件设置为更小，我就看不到溢出的芯片:(

【问题讨论】：

【解决方案1】：

筹码标记以flex 定位，因此一些自定义样式可以解决问题。可惜这不是默认行为。

.p-chips-multiple-container {
  flex-wrap: wrap;
  align-content: space-between;
  padding-bottom: 0;
}

.p-chips-token, .p-chips-input-token {
  margin-bottom: 0.5rem;
}

从您安装的任何主题中获取边距值。

【讨论】：

太好了，谢谢！我必须将样式添加到 _theme_styles.scss 文件才能被拾取。