I'm trying to disable reminder of my password input field at my login screen. Here is my input field:

<r-input
        type="text"
        id="login_username"
        width="95%"
        v-model="formJson.username"
        labelColor="white"
        @keyup.enter="handleLogin"
      ></r-input>

I tried autoplete=off, but it didn't work. Any suggestion?

I'm trying to disable reminder of my password input field at my login screen. Here is my input field:

<r-input
        type="text"
        id="login_username"
        width="95%"
        v-model="formJson.username"
        labelColor="white"
        @keyup.enter="handleLogin"
      ></r-input>

I tried autoplete=off, but it didn't work. Any suggestion?

• javascript
• vue.js
• google-chrome
• password-protection

• 1 Does this answer your question? Disabling Chrome Autofill – Radu Diță Commented Apr 17, 2020 at 8:04
• check this thread stackoverflow./questions/15738259/disabling-chrome-autofill – Radu Diță Commented Apr 17, 2020 at 8:05
• Actually now ı can disable autofill my username input area with autoplete="new-password" but when my input area type="password" it doesnt work as well, ı need disable autofill password input area as well – Murat Can Kağıtcı Commented Apr 17, 2020 at 8:35
• 1 I think you need to read the whole page, as there is a lot of discussion about how to disable autofill in chrome, and a link to a chrome issue that details reasons why people need to disable autofill, so that the issue can properly be resolved. That is to say, there is no guaranteed way to disable autofill at the moment. – Matt Ellen Commented Apr 17, 2020 at 10:09

6 Answers 6

try this: vue-disable-autoplete

How to use

import DisableAutoplete from 'vue-disable-autoplete';

Vue.use(DisableAutoplete);

HTML attribute

<input type="email" name="email" autoplete="off">

You only need to put in the autoplete parameter: nope

<input
  type="text"
  v-model="name"
  autoplete="nope"/>

According to a similar question here on stackoverflow Disabling Chrome Autofill

Since Sept 2020: autoplete="chrome-off" disables Chrome autofill.

I know the subject is old, but it seems that with each update of Chrome, the problem es back. I tried in several ways, including autoplete="nope" and this.$refs.inputHoweverName.$el.setAttribute('autoplete', 'nope');

Recently in Chrome version 87.0.4280.88, the only way I could, without having to install any plugin, using native javascript, was to create a dynamic id:

markup example

<v-text-field :id="dynamicID()" ... </v-text-field>

method example

dynamicID() { return 'dynamicID-' + Math.floor(Math.random() * Date.now().toString()); },

I do not know if it is the most elegant and efficient way, but for me it solved and that in many is enough.

First, you have to install

npm install --save vue-disable-autoplete

import this one

import DisableAutoplete from '@aacassandra/vue-disable-autoplete'; Vue.use(DisableAutoplete);

for input...

for form...

autoplete="off" will be ignored by most browsers. You can pass a string there to help the browser find the correct autoplete. Example: autoplete="email" To switch it off, pass something that the browser will not understand. Example: autoplete="shut-up-google" will switch the autoplete off.