Хорошо, я столкнулся с очень странным сценарием, здесь у меня есть таблица, и когда вы нажимаете на нее область, она расширяется и показывает больше информации. и когда он расширяется, я хочу удалить закругленные границы, чтобы сделать цвет гладким. В основном это происходит при нажатии между различными tr
, и для этого я использую эту функцию. И обычно это работает, если я нажимаю область, чтобы удалить расширенную область, а затем снова делаю резервную копию в том же ряду, так что это действительно случайно
function getRowColor(props: Props, i :Info)
{
if(i.currentTarget === props.currentTarget)
{
return "without-border";
}
return "with-border";
}
}
и КСС
.with-border td:first-child
{
border-top-left-radius: 0.3em;
border-bottom-left-radius: 0.3em;
}
.with-border td:last-child
{
border-top-right-radius: 0.3em;
border-bottom-right-radius: 0.3em;
}
.without-border td:first-child {
border-bottom-left-radius: 0;
}
.without-border td:last-child {
border-bottom-right-radius: 0;
}
элемент, на который я нацеливаюсь, существует несколько из них, отображаемых на основе значения.
<tr className={getRowColor(props, l)}>
И я вижу в инспекторе, что правила применяются так, как они должны, но экран иногда вносит изменения, а иногда и не очень ненадежно, даже если инспектор выглядит корректно при удалении, а добавление рендера - нет. У кого-нибудь есть идеи, почему? Он перерисовывается, потому что в противном случае класс не будет добавлен / удален, когда я нажму на другую строку, но по какой-то причине border-radius иногда не повторяет css.
EDIT
Ладно, я попробовал поставить зеленый фон с рамкой, а красный - без, а когда радиус границы не применяет цвет фона, все равно сделайте так, что, очевидно, это как-то связано только с радиусом границы