Laravel 10+Breeze如何本地化登录/注册错误提示信息？

问题本质 #

"Please fill out this field" 是浏览器原生HTML5表单验证的提示文本，并非Laravel后端生成的验证信息，因此不会出现在Laravel的lang/*/validation.php文件中。

解决办法 #

方案1：禁用HTML5原生验证，改用Laravel后端验证

Breeze的登录、注册表单默认依赖HTML5的required等属性触发前端验证，只需在表单标签中添加novalidate属性即可禁用该功能，转而使用Laravel后端验证返回本地化提示：

<!-- 修改resources/views/auth/login.blade.php中的表单标签 -->
<form method="POST" action="{{ route('login') }}" novalidate>

禁用后，当用户提交空表单时，Laravel会触发后端验证逻辑，返回你在lang/{myLocaleCode}/validation.php中定义的required规则对应的本地化文本。

方案2：自定义HTML5原生验证提示（保留前端验证）

若想保留HTML5前端验证并本地化提示，可通过以下两种方式实现：

• 方法A：JavaScript动态设置提示
  为需要验证的输入框添加事件监听，利用setCustomValidity方法替换默认提示：

  // 示例：针对邮箱输入框
  const emailInput = document.querySelector('#email');
  // 输入时重置提示
  emailInput.addEventListener('input', () => emailInput.setCustomValidity(''));
  // 验证失败时设置本地化提示
  emailInput.addEventListener('invalid', () => {
      emailInput.setCustomValidity('{{ __('请填写此字段') }}');
  });
  

  注意：需在对应语言文件（如lang/{myLocaleCode}/messages.php）中添加翻译键值：

  // lang/zh-CN/messages.php
  return [
      'fill_field' => '请填写此字段',
  ];
  

  然后将JS中的__('请填写此字段')替换为__('messages.fill_field')，保证文本随语言配置切换。

• 方法B：HTML title属性（兼容性有限）
  给输入框添加title属性，部分浏览器会在验证失败时显示该属性值：

  <input type="email" name="email" required title="{{ __('messages.fill_field') }}">
  

  注意：不同浏览器对该属性的支持存在差异，部分浏览器仍会显示默认提示。

内容的提问来源于stack exchange，提问作者Mottore