ВОпрос, мне надо при наличии нажатого чекбокса, присвоить переменой status, значение true. Как это сделать? Так же любопытно послушать мб кто-то посоветует в целом подобную задачку по другому реализовать. Суть в том, что человек пишет возраст, если ему до 18 - закрывается доступ всплывает окно "сопровождающий" чекбокс. Нужно что бы по нажатию галочки - статус становился true(доступ открывается). Если человеку больше 18 - доступ открыт.
<!DOCTYPE html>
<html>
<head>
<title>Проверка возраста</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
</head>
<body>
<section id="app">
<h1 id="message" v-bind:class="[ status ? 'open' : 'close']">{{ result }}</h1>
<input type="number" name="age" placeholder="Ваш возраст" id="age" v-model="age">
<button type="submit" id="button-check" v-on:click="checkAge">Проверить</button>
<div v-show="hide" id="hide-param">
<label>Есть сопровождающий? <input type="checkbox" name="accompanied" id="accompanied" v-model="checked" v-on:click="accompanied"></label>
</div>
</section>
<script type="text/javascript" src="script.js"></script>
</body>
</html>
let app = new Vue({
el: '#app',
data:{
message:{
open: 'Вам 18 лет и больше, доступ открыт',
close: 'Вы младше 18 лет, доступ закрыт',
unclose: 'Вам меньше 18 лет, но есть сопровождающий, доступ открыт'
},
age: null,
result: null,
hide: false,
status: null,
checked: null
},
methods: {
checkAge(){
this.checked = false;
if(this.age < 18){
this.result = this.message.close;
this.status = false;
this.hide = true;
}else{
this.status = true;
this.result = this.message.open;
}
}
}
})