Prólogo: Hace poco escribí un pequeño módulo de ul li, tan simple que realmente me hizo trabajar duro, y no he escrito este tipo de cosas en mucho tiempo. Los pequeños detalles de la interfaz de usuario también están bastante torcidos.
necesidad:
La idea original era que el color de fondo del ul-li cambia cuando el mouse se mueve hacia adentro y hacia afuera.
Finalmente, se confirman los requisitos y, después de hacer clic, el color de fondo cambia.
<li
key={item.id}
className={styles['wmx-group-left-list__li']}
style={
{ background: currentRow.id === item.id ? '#FEF6D8' : '#fff' }}
onClick={() => getCurrentRow(item, index)}
>Lo principal es que hay un método getCurrentRow al hacer clic para obtener el li en el que se ha hecho clic actualmente,
const getCurrentRow = (item, index) => {
if (!checkboxShow) {
setCurrentRow(item);
setCurrentIndex(index);
}
};Luego, al juzgar por el estilo, el color de fondo cambiará.