every與some實現全選與提交的基礎判斷
阿新 • • 發佈:2018-11-24
every與some的區別:
1.every一假都假
2.some一真都假
實現的具體效果:
1.every實現所有複選框都選中全選按鈕選中
2.every實現所有複選框有一個不選中全選按鈕取消選中
3.使用some實現有其中一個選中則可以提交,否則不能提交
<div class="app"> <div v-for="(item,index) in checks"> <input type="checkbox" :checked="item.check" v-model="item.check" @change="info"> {{item.value}}</div> <input type="checkbox" :checked="checkAll"> 全選 <br> <button :disabled="checkDis">確定</button> </div> <script> new Vue({ el: '.app', data () { return { checks:[ { check:false, value: '蘋果' }, { check: false, value: '草莓' }, { check: false, value:'香蕉' } ], checkAll: false, checkDis: false } }, mounted () { this.info() }, methods: { info () { var flg = this.checks.every((item,index) => { return item.check }) this.checkAll = flg var btnFlg = this.checks.some((item,index) =>{ return item.check }) this.checkDis = !btnFlg } } }) </script>