Как при нажатии на "," (запятую) не выводить её в input? (chips component React)

Question

Я создаю chips компонент. Вот мой codesandbox - https://codesandbox.io/s/relaxed-glitter-dkh25?file=/src/App.js для примера. Я набираю текст в input и при нажатии на запятую (",") создаю новый чипс. Однако после создания этого чипса у меня в input остается запятая.

Я хотел бы что-бы она не появлялась. Как мне это сделать?

Функция добавления чипса

  const handleKeyDown = (event) => {
    if (event.key === ",") {
      setChips([...chips, event.target.value]);
      setInput("");
    }
  };

Answer 1

Не зная логики работы ваших функций можно предложить классику - event.preventDefault().

document.querySelector('input').addEventListener('keydown', event => {
  if (event.key === ",") {
    console.log(',');
    event.preventDefault();
  }
})

<input type="text">

БЛОГ НА HUSL

Как при нажатии на "," (запятую) не выводить её в input? (chips component React)

Ответы (1 шт):