Удалить нижнюю границу для ячеек в определенном столбце

Есть ли способ удалить разделитель строк для определенного столбца. Я попытался переопределить стили по умолчанию, написав миксин scss, как показано ниже:

    .ag-theme-balham-custom {
       @include ag-theme-balham(
        (
          row-border-color: null,
        // row-border-color: blue,
        )
       );
     }

Он работает, но, очевидно, он удаляет разделитель для всех строк сетки. Что мне нужно добиться, так это то, что если есть 10 столбцов, разделитель строк (нижняя граница) строк 9-го и 10-го столбцов должен быть скрыт по умолчанию и должен отображаться только при наведении заголовка соответствующего столбца.

Как показано на изображении, разделитель строк должен быть скрыт для столбца «Тест» и должен отображаться только при наведении курсора на заголовок столбца «Тест».

Я имею в виду выделенные строки


ag-grid-react ag-grid
person Anurag Mantripragada    schedule 06.05.2020    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вы можете сделать это, добавив правило класса ячеек в этот конкретный столбец в столбцеDefs, т.е.

  {
    field: 'yourField',
    cellClassRules: { 'no-border-cell' },
  }

Вы даже можете применить класс, когда ваша ячейка, т.е.

cellClassRules: { 'no-border-cell': ({ data }) => data.fieldValue === 'a' }

Для границы строки вы можете использовать getRowStyle в своих gridOptions, т.е.

gridOptions.getRowStyle(params) {
    if (params.data.myColumnToCheck === myValueToCheck) {
        return {'border': 'none'}
    }
    return null;
}
person Muhammad Haseeb    schedule 07.05.2020
comment
Привет @Хасиб. Спасибо за ответ. Добавление cellClassRules не помогло. Я добавил изображение в свой вопрос, чтобы просто уточнить, о каких границах я говорю. - person Anurag Mantripragada; 07.05.2020
comment
Итак, границы, о которых вы говорите, относятся к строкам, а не к столбцам (ячейкам). - person Muhammad Haseeb; 08.05.2020
comment
У меня сработало, можете ли вы создать пример своего кода? или опубликуйте параметры сетки, которые вы используете - person Muhammad Haseeb; 09.05.2020