Checkbox checked but I want it not checked-CodePudding

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

CodePudding user response：

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 y a 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>