Как добавить правило наведения в css className, чтобы окрасить определенную строку при наведении в react-table?

#javascript #css #reactjs #html-table #react-table

#javascript #css #reactjs #html-таблица #react-table

Вопрос:

Я успешно применил classname и добавил цвет к определенной строке в моей react-таблице. Но я не могу добавить правило наведения курсора к этому имени класса, чтобы применить другой цвет при наведении курсора на строку. Как применить правило наведения для добавления эффекта наведения? Заранее спасибо!

Вот мой код:

 <ReactTable>
...

getTrProps={(state, rowInfo, column, instance) => {

        let className = '';
        if(rowInfo amp;amp; rowInfo.original){
          if(highlightedCerts.includes(rowInfo.original.id)){
            className = ' highlightedCertRow';
          }
          else if(rowInfo.original.isRevoked) {
            className = ' revokedCertRow';
          }
          else if(rowInfo.original.blocked) {
            className = ' blockedCertRow';
          }
        }
     return {
      ...
     className: className,
     ...
     };
/>

Ответ №1:

Замените green цвет на его код rgb, если green код есть 0,127,252 , то используйте .highlightedCertRow:hover { background-color: rgba(0,127,252, 0.3) !important; } .

Ответ №2:

Я решил это самостоятельно. Произошла небольшая ошибка с вложенными тегами в css.