复选框已选中，但我不想选中它

Question

I have a issue where I don't know why I have that, so I want if the password is not correct with my prompt alert so with my v-model , the checkbox stays not checked but always it turns to checked, it doesn't do like I want and I can't explain that.... Here is my code :

<template>
  <form  action="#/login" >
    <input type="email" placeholder="Insérez votre adresse-mail pour créer votre compte"/>
    <input type="password" placeholder="Mettez y votre mot de passe">
    <label for="admin"> Droits administrateurs </label>  <input type="checkbox" id="admin" v-model="checked" @click="noEntry">
  </form>
</template>

<script>
module.exports = {
  name: "Signup",
  data () {
    return {
      checked: false,
    }
  },
  methods : {
    noEntry()
    {let password;
      password = this.checked ? "" : prompt("Seul le personnel de la librairie y a accès, veuillez inscrire le mot de passe", "");
      if(password === "administrations") { this.checked = true;}
      else { this.checked = false}
    }
  }
}
</script>

<style scoped>

</style>

Thanks you everyone

Have a nice day

Answer 1

Please take a look at snippet:

(use @change for checkbox and check if it is not false)

 new Vue({ el: "#demo", data () { return { checked: false, } }, methods : { noEntry() { let password; password = !this.checked ? "" : prompt("Seul le personnel de la librairie ya accès, veuillez inscrire le mot de passe", ""); password === "administrations" ? this.checked = true : this.checked = false console.log(this.checked) } } })

 <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script> <div id="demo"> <form action="#/login" > <input type="email" placeholder="Insérez votre adresse-mail pour créer votre compte"/> <input type="password" placeholder="Mettez y votre mot de passe"> <label for="admin"> Droits administrateurs </label> <input type="checkbox" id="admin" v-model="checked" @change="noEntry"> </form> </div>