Реагируйте, идентифицируйте нажатую клавишу управления или shift

#reactjs

Вопрос:

Я представляю таблицу следующим образом

 <div>
   <table>
     <tbody>
          {students.map(x)=> ( <tr onClick{(e)=>selectStudent(i)} ={><td>{x}</td></tr>)}
     </tbody>
   </table>
</div>
 

Щелчок по строке работает нормально. Мой вопрос, как захватить клавиши управления и переключения вместе с щелчком мыши?

Ответ №1:

Вам нужно проверить, зарегистрировало ли событие щелчка эти нажимаемые клавиши.

В этой статье описывается процесс:

     onClick={e => {
      if (e.ctrlKey || e.metaKey) return onCmdControlClick(e);
      onClick(e);
    }}
 

Комментарии:

1. Спасибо, Самуэй

Ответ №2:

Вы можете записывать события клавиатуры, такие как onKeyDown , onKeyPress , onKeyUp .

  const keyboardEventHandler = (e) => {
    if (e === "Shift") {
      // do something
      console.log("Shift is pressed");
    } else {
      console.log(`${e} is pressed`);
    }
  };
return(
<input onKeyDown={(e) => keyboardEventHandler(e.key)} type="text"/>
)

 

Рабочая Демонстрация

Комментарии:

1. Дмитрий, спасибо тебе тоже за помощь