Angular FullCalendar 5：如何设置多资源区域列的单独宽度

可以为资源区域的每一列单独设置宽度，你的配置思路完全可行，具体说明如下：

• FullCalendar v5 的 resourceAreaColumns 配置项支持为每个列对象添加 width 属性，该属性定义的是当前列在资源区域总宽度内的占比（而非页面整体宽度）。
• 你设置的 depot 列占30%、title列占70%，两者比例总和为100%，符合布局逻辑，最终两列会在resourceAreaWidth指定的10%页面宽度内，按3:7的比例分配空间。

验证后的完整配置代码：

resourceAreaColumns: [
  {
    group: true,
    field: 'depot',
    headerContent: 'HL',
    width: '30%'
  },
  {
    field: 'title',
    headerContent: 'LKW',
    width: '70%'
  }
],
resourceAreaWidth: '10%',

注意：若各列宽度比例之和不为100%，FullCalendar会自动按比例缩放调整，建议保持比例总和为100%以获得精准的布局效果。

内容的提问来源于stack exchange，提问作者Alex