Can you help me simplify this problem:
In my Vue.js template using Vuetify components, there is a checkbox present:
<v-checkbox
v-model="selected"
label="John"
value="John"
id ="john"
@click.native="checkit">
</v-checkbox>
The code for the checkit() method is as follows:
checkit: function() {
let elt = document.getElementById('john')
if(elt.checked) {
console.log('checked')
} else {
console.log('unchecked')
}
}
However, the result I am getting is opposite - it shows unchecked when checked and vice versa.
What could be causing this issue and how can it be resolved?