Vuetify：在 chrome 中禁用自动完成

Question

发布此 question/answer 是为了让那些使用 Vuetify 并在 Chrome 中遇到自动完成问题的人更好地了解。我已经看到了很多关于这个话题的答案。我的解决方案涉及生成随机 name 属性。请参阅下面的答案。

Answer 1

这是适合我的解决方案。

我正在使用 uuid v4 方法生成随机 name 属性。如果您依赖传统表单数据的名称，那么显然这可能对您不起作用，除非您保留名称映射 -> v4 输出。下面的示例适用于我的信用卡表单，但我也在我的登录表单中实现了它。

import { v4 } from 'uuid'

<v-text-field
    v-model="card"
    class="card-input"
    outlined
    :name="v4()"
    label="Credit Card Number"
    :rules="creditCardNumberRules"
    v-mask="[' ####  ####  ####  ####', ' ####  ####  #####  ###']"
/>

Vuetify：在 chrome 中禁用自动完成

Vuetify: Disabling autocomplete in chrome

google-chrome

autocomplete

vuetify.js