javascript - 如何让 columnMenu 在每一列中呈现并在 Kendo React Grid 中正确过滤？

Question

我有这个剑道反应网格：

<Grid
          data={rows}
          skip={page.skip}
          take={page.take}
          pageable={{
            buttonCount: 10,
            info: true,
            numeric: false,
            pageSizes: [25, 50, 100],
            previousNext: true,
          }}
          sortable={true}
          total={total}
        >
          <Column field="ID" title="ID" filter={"text"} columnMenu={ColumnMenu}/>
          <Column field="Communication Status" title="Communication Status" filter={"text"} columnMenu={ColumnMenu}/>
          <Column field="Last Reading" title="Last Reading" filter={"date"} columnMenu={ColumnMenu}/>
        </Grid>

如您所见，我columnMenu为每一列设置了一组，但它只出现在最右边的Last Reading列中。我希望标记为黄色的点也有过滤器。 我的另一个问题是过滤卡住并且日历无法正确呈现。 我一直在关注这里的文档，但是我的代码并没有呈现相同的内容。

更新：我检查了网格，发现所有的 columnMenus 都在右侧堆叠在一起。有没有其他人遇到过这个问题？请看下面的样式截图。