如何禁用Vuetify v-text-field密码输入框的自动补全功能？

针对你遇到的autocomplete="off"无效的情况，试试这几个更可靠的方案：

方案1：使用autocomplete="new-password" #

这是W3C推荐的专门用于新密码创建/修改场景的属性，大部分现代浏览器都会尊重这个设置，直接阻止自动填充：

<v-text-field
  v-model="password"
  label="Password"
  type="password"
  autocomplete="new-password"
></v-text-field>

方案2：动态切换输入框类型 #

部分浏览器会强制对type="password"的输入框触发自动补全，我们可以初始设为text，聚焦后再切换为password，同时配合autocomplete="off"：

<v-text-field
  v-model="password"
  label="Password"
  :type="isPasswordFocused ? 'password' : 'text'"
  autocomplete="off"
  @focus="isPasswordFocused = true"
  @blur="isPasswordFocused = false"
></v-text-field>

记得在组件data里定义状态变量：

data() {
  return {
    password: '',
    isPasswordFocused: false
  }
}

方案3：随机化name和id属性 #

浏览器有时会通过输入框的name/id匹配已保存的密码记录，给这两个属性设置随机值可以打破这种匹配：

<v-text-field
  v-model="password"
  label="Password"
  type="password"
  autocomplete="off"
  :name="`password-${Math.random()}`"
  :id="`password-${Math.random()}`"
></v-text-field>

如果单个方案无效，可以尝试组合使用（比如方案1+方案3），基本能覆盖绝大多数浏览器的情况。

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