Validating Form Input with Fallback Error Messages

<script>
  let email = '';
  let errorMessage = '';
 
  function validateEmail() {
    if (!email.includes('@')) {
      errorMessage = 'Please enter a valid email address.';
    } else {
      errorMessage = '';
    }
  }
</script>
 
<input bind:value={email} on:blur={validateEmail} placeholder="Enter email" />
{#if errorMessage}
  <p class="error">{errorMessage}</p>
{/if}