iview 全选

<template> <div style="border-bottom: 1px solid #e9e9e9;padding-bottom:6px;margin-bottom:6px;"> <Checkbox :indeterminate="indeterminate" :value="checkAll" @click.prevent.native="handleCheckAll">全选</Checkbox> </div> <CheckboxGroup v-model="checkAllGroup" @on-change="checkAllGroupChange"> <Checkbox label="香蕉"></Checkbox> <Checkbox label="苹果"> </Checkbox> <Checkbox label="西瓜"> </Checkbox> </CheckboxGroup> </template>

<script> export default { data () { return { indeterminate: true, checkAll: false, checkAllGroup: \['香蕉', '西瓜'\] } }, methods: { handleCheckAll () { if (this.indeterminate) { this.checkAll = false; } else { this.checkAll = !this.checkAll; } this.indeterminate = false; if (this.checkAll) { this.checkAllGroup = \['香蕉', '苹果', '西瓜'\]; } else { this.checkAllGroup = \[\]; } }, checkAllGroupChange (data) { if (data.length === 3) { this.indeterminate = false; this.checkAll = true; } else if (data.length > 0) { this.indeterminate = true; this.checkAll = false; } else { this.indeterminate = false; this.checkAll = false; } } } } </script>

<template> <Button @click="loading">Display loading...</Button> </template> <script> export default { methods: { loading () { const msg = this.$Message.loading({ content: 'Loading...', duration: 0 }); setTimeout(msg, 3000); }, } } </script>

handleSpinShow () { this.$Spin.show(); setTimeout(() => { this.$Spin.hide(); }, 3000); },

转载于:https://my.oschina.net/kuakexing123/blog/2875496