Почему цвет фона ячейки исчезает, когда пользователь нажимает на ячейку?

#javascript #reactjs

Вопрос:

Вот мой код.

URL-адрес демо-версии находится здесь.

Фон:

Я создаю сетку, которая может поддерживать выбор ячеек перетаскиванием мыши.

И цвет фона ячейки изменится, когда пользователь введет в ячейку определенное значение.

Например: если пользователь вводит » а » в ячейку, фон ячейки будет изменен на розовый.

Проблема:

Обе функции работают должным образом, однако, когда я нажимаю на последнюю ячейку каждой строки, цвет фона ячейки исчезает.

Я использую следующую кодировку для отслеживания изменения содержимого ячейки и соответствующего изменения цвета фона ячейки.

 useEffect(()=>{
  console.log("h0," props.children);
  setClassName(props.className);
  setValue(props.children);
},[props.className,props.children]);

useEffect(()=>{
   console.log("h1," className);
   let newClassName=className;
   if(activeShiftInfo[value]){
     newClassName =' ' activeShiftInfo[value].cssClassName;
     setClassName(newClassName);
   }
 },[value]);
 

К сожалению, оба они не могут работать, это что-то мне не хватает?

Ответ №1:

Добавьте props.classname ко второму эффекту использования в качестве зависимости. Второй эффект использования не запускается в mouseEnter, как первый -> таким образом, класс обновляется в первом эффекте использования без запуска второго.