web-dev-qa-db-ja.com

Vue jsでチェックボックスがチェックされているかどうかを判断する方法

Vue js 2でチェックボックスがチェックされているかどうかを判断したいだけです。jqueryには$( 'input [type = checkbox]')。prop( 'checked');これは、チェックボックスがチェックされているかどうかにかかわらずtrueを返します。Vue js。

コードを使用したシナリオを次に示します。ブレードテンプレートでlaravelを使用していることに注意してください。

@foreach ($roles as $role)
   <input type="checkbox" v-on:click="samplefunction({{$role->id}})" v-model="rolesSelected" value="{{$role->id}}">                       
@endforeach  

Jsの部分は

<script>
  var app = new Vue({
    el: '#app1',
    data: {
      rolesSelected:"",
    },
    methods : {
      samplefunction : function(value) {
        // Here i want to determine whether this checkbox is checked or not   
      }
    },
  });

</script>
12
Geordy James

次のようなことができます:

_if(this.rolesSelected != "") {
   alert('isSelected');
}
_

またはv-on:click="samplefunction({{$role->id}},$event)"

_samplefunction : function(value,event) {
        if (event.target.checked) 
      }
_
24
madalinivascu

これは私のために働いた。

<input type="checkbox" :id="poid" class="unchecked" name="single_select" ref="rolesSelected">

function (){
  if(this.$refs.rolesSelected.checked == false) {
    //do something
  }
}

function (){
  if(this.$refs.rolesSelected.checked == true) {
    //do something
  }
}
2
Raj