フォームで空白文字を送信しない方法
フォームに入力した文字をボタンのonClickで送信するときに、「空白文字が含まれる場合は送信できないようにする」方法。
(React/TypeScript)
<Button
onClick={() => {
if (todo.trim() !== '') {
postTodo()
setTodo('')
}
}}>
送信ボタン
</Button>
上記の例では、todo.trim() !== ''
という条件式で、空白文字を含むTODOリストを送信しないようにしています。trim()
は文字列の「先頭と末尾から空白文字を除去」するメソッド。
条件式の意味は、todoの「先頭と末尾から空白文字を除去」した結果が空文字列でなければ、TODOリストを送信する、ということ。