Вход Vue.js (флажок радио) не переключается при использовании: проверяется с помощью @input или @click вместе

Question

https://jsfiddle.net/50wL7mdz/359940/

<script src="https://unpkg.com/vue"></script>

<div id="app">
  <label>                   
    <input 
    type="checkbox"
            name="demo"
    :checked="isChecked"
            @input="someMeth('A')" 
    value="A"/> 
    A
 </label>
 <label>
    <input
    type="radio" 
    name="demo"
    :checked="isChecked"
    @input="someMeth('B')" 
    value="B"/> 
    B
 </label>
 <div>
  {{somedata}}
 </div>
</div>

Нажатие на вход (флажок или радио) не переключает его состояние.

Удалить либо: флажок, либо @input решит проблему.

но мне нужны оба.

@ щелчок делает то же самое.

Answer 1

в vue.js, значение флажка привязывается с помощью v-model.

new Vue({
  el: '#app',
  data: {
    checktype: 'checkbox',
    somedata: [],
    isChecked: false,
    isChecked2: false,
  },
  methods: {
  	someMeth(val) {
    		this.somedata.push(val)
    }
  }
})

<script src="https://unpkg.com/vue"></script>

<div id="app">
    <label>
        <input 
            :type="checktype"
            :name="demo"
            v-model="isChecked"
            @input="someMeth('A')" 
            value="A"/>	
            A
    </label>
    <lable>  
        <input
            :type="checktype" 
            :name="demo"
            v-model="isChecked2"
            @input="someMeth('B')" 
            value="B"/>	
            B
    </lable>
    <div>
        {{somedata}}
    </div>
</div>