My input elements are made like this - https://codepen.io/anon/pen/gEZoNY?&editable=true&editors=101 .

<div id="app"> 

  <v-flex xs12 sm6> <v-text-field :type="'text'" name="login" label="логин" hint="At least 8 characters" ></v-text-field> <v-text-field v-model="password" :append-icon="show1 ? 'visibility' : 'visibility_off'" :rules="[rules.required, rules.min]" :type="show1 ? 'text' : 'password'" name="input-10-1" label="Normal with hint text" hint="At least 8 characters" counter @click:append="show1 = !show1" ></v-text-field> </v-flex> </v-layout> </v-container> </v-form>

Those. Initially, the label is, as it were, inside the input element, and when the user clicks on it, or as if it has filled it, the label moves aside and displays the input. (see example in codepen).

Everything works well, but exactly as long as the username and password do not replace the browser’s password manager from autocomplete.

As soon as this happens ( you can check in the example, you need to drive any nonsense on this form in the codepen and save it in the password manager of the browser, and then re-open this page ). The label does not initially receive the Input event, and the label does not move aside.

Can you please tell me how to fix this?

Maybe you can somehow track when the browser is something substitutes in the input, and when not?

  • why not check the field by timeout after loading? - Stranger in the Q
  • It does not work, although visually the field is filled with the browser, but in fact its input is empty until the user clicks somewhere, otherwise the label itself would have fled. At least it worked that way for me, or rather it didn’t work when I tried to check with timeout, maybe I did something wrong? - vvtvvtvvt1 pm

0