React+TypeScript开发macOS应用：MUI TextField首字母大写弹窗问题

这个问题是由浏览器/系统的自动文本格式化功能导致的，通过以下设置可以解决：

核心解决方案：添加autocapitalize="none"属性 #

首字母自动大写和提示是由autocapitalize属性控制的，只需禁用该功能即可：

方案1：在TextInputField组件全局设置 #

修改组件内部的TextField配置，默认禁用首字母大写：

return (
  <TextField
    label={isFocused || !isInputValueEmpty ? '' : t(inputLabel)} 
    size='small'
    {...props}
    autocapitalize="none" // 禁用首字母自动大写
    spellCheck={false} // 可选：关闭拼写检查，避免额外提示弹窗
    InputProps={inputPropsStyle}
    onFocus={onFocus}
    onBlur={onBlur}
  />
)

方案2：在特定输入框单独设置 #

如果仅需在邮箱/用户名这类输入框禁用，直接在调用组件时传递属性：

<TextInputField
  disabled={isEmailDisabled}
  inputLabel='yourEmail'
  onChange={(val) => setUserName(val.currentTarget.value)}
  type='email'
  inputValue={userName}
  autocapitalize="none" // 针对该输入框禁用首字母大写
  autocomplete="off" // 可选：配合关闭自动补全，增强效果
/>

说明：为什么之前的autoComplete无效？ #

autoComplete仅控制表单自动填充功能，和首字母大写是两个独立的控制项，因此单独设置autoComplete无法解决这个问题。

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