需要が薄いMaterial-UIのvalidationの一例

空文字を許容しない、というバリデーションを一部分だけ書きたい、しかしそのために本格的なバリデーションの機構を組むのはめんどくさくて死にそう、という時にその場しのぎで書いたもの。

<TextField
  label="名前"
  variant="outlined"
  margin="normal"
  required

  // input.valueに入力された文字が入っているものとして、空文字の場合は input.value はfalseを返す
  // 上記の場合に{ error: true }を返すことで <TextField error /> と書いた時と同じようになる
  // { error: false } の場合はerrorは指定されていない状態になる
  {...(!input.value ? { error: true } : { error: false })}
/>