0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

TextFieldをonBlurしたタイミングで更新したいんだけどスペースキー押した時にも発火するの困る

Posted at

の、解決策。以下のような感じでいけた。


const handleKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
  if (event.key === " ") {
    event.stopPropagation();
  }
};

const MyComponent {
  return (
    <TextField
      onKeyDown={handleKeyDown}

      //...onBlurで発火したりonChangeで何かしたり
    />
  );
}

export default MyComponent;

ここに辿り着くまでに色々こねくりまわしてしまったけど最終的には event.stopPropagation(); を使うだけでよかった。

chatGPTに聞くと、冗長すぎる(もしくは意図と異なる伝わり方をしてる) 回答が返ってくるので、安易に参考にしすぎないことも大事だなー。
中途半端に動いちゃうのも厄介だったりする。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?