PrimeNG 芯片溢出行为

Question

当我有太多 'chips' 无法放入 <p-chips> 组件时，它会开始水平拉伸组件，直到它超出页面边缘。我希望它垂直展开，然后换行到下一行（就像 material UI 那样）。

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

Answer 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;
}

从您安装的任何主题中获取保证金值。

PrimeNG 芯片溢出行为

PrimeNG Chips overflow behaviour

primeng