V-bind:disable button until fill input

I am trying to disable submit button, until I fill 4 characters in password input. I am goint step by step with vueschool.io/vue.js 3 fundamentals with the options API/chapter 10. and doesnt work for me.

    <div 
      >
        <label
          for="password">
        </label>
      <!-- Pin kód -->
        <input
          minlength="4"
          maxlength="4"
          id="password"
          type="password"
          placeholder="****" />
    </div>
    <div
          id="div-submit">
            <button
              v-bind:disabled="password.length < 4"
              @click="password"
              id="submit"
            </button>
    </div>

<script>
export default {
  data(){
    return {
      password: '',
    }
  }
}
</script>

CodePudding user response：

You need to actually bind the data to the input

<input v-model="password" ...>