鍍金池/ 問答/PHP  HTML/ element ui 中的chekbox 哪個(gè)屬性是讓它取消勾選???

element ui 中的chekbox 哪個(gè)屬性是讓它取消勾選啊?

<el-checkbox-group v-model="abCityone" @change="handleCheckedCitiesChange1">

      <el-checkbox  v-for="(city, index) in aras" :label="city" :key="index"  @change="retAurn(index)">{{city.name}}</el-checkbox>
    </el-checkbox-group
    
    點(diǎn)擊的時(shí)候,會(huì)勾選!
    然后我設(shè)置了一個(gè)子組件,用來顯示勾選的內(nèi)容!
    <li v-for="(item, index) in ipTm"
    :key="index"
    v-show="item.selected" @click="remove(index)">
  {{item.name}}
</li>
remove: function (i) {
  this.ipTm[i].selected = false
  this.$emit('vbl', this.ipTm[i].selected)  傳給父組件的是一個(gè)false
  console.log(i, 1111)
  console.log(i, 2222)
}
然后我點(diǎn)擊子組件顯示的文字想讓父組件的。。被勾選中的內(nèi)容,去掉勾選!
回答
編輯回答
呆萌傻

checkbox 加個(gè)v-model="city.check",每個(gè)aras的數(shù)據(jù)添加一個(gè){check:false}
$emit把index和this.ipTm[i].selected傳過去,$on接收,然后this.aras[傳過來的index].check = 傳過來的selected

2018年6月8日 06:07
編輯回答
怣人

checked

2017年11月21日 22:54
編輯回答
維他命

element給出了選中和取消的屬性isIndeterminate,通過change事件改變?cè)搶傩缘腷oolean的屬性值貼上代碼

<template>
  <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全選</el-checkbox>
  <div style="margin: 15px 0;"></div>
  <el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
    <el-checkbox v-for="city in cities" :label="city" :key="city">{{city}}</el-checkbox>
  </el-checkbox-group>
</template>
<script>
  const cityOptions = ['上海', '北京', '廣州', '深圳'];
  export default {
    data() {
      return {
        checkAll: false,
        checkedCities: ['上海', '北京'],
        cities: cityOptions,
        isIndeterminate: true
      };
    },
    methods: {
      handleCheckAllChange(val) {
        this.checkedCities = val ? cityOptions : [];
        this.isIndeterminate = false;
      },
      handleCheckedCitiesChange(value) {
        let checkedCount = value.length;
        this.checkAll = checkedCount === this.cities.length;
        this.isIndeterminate = checkedCount > 0 && checkedCount < this.cities.length;
      }
    }
  };
</script>
2017年5月15日 20:05