Как заставить меню столбцов отображаться в каждом столбце и правильно фильтроваться в сетке Kendo React?

#javascript #reactjs #kendo-ui #kendo-grid #kendo-react-ui

Вопрос:

У меня есть эта сетка реакции Кендо:

 <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 столбце. Я хочу, чтобы в местах, отмеченных желтым цветом, тоже были фильтры.
колумнМену
Другая моя проблема заключается в том, что фильтрация застревает, и календарь отображается неправильно.
ошибки в фильтрах и календаре
Я следил за документацией здесь, однако мой код не отображает то же самое.

ОБНОВЛЕНИЕ: Я осмотрел сетку и обнаружил, что все столбцы расположены друг на друге с правой стороны. Кто-нибудь еще сталкивался с этой проблемой? Пожалуйста, посмотрите приведенный ниже скриншот стиля. Стиль значков меню