other / mew-iview

Commit 99cde29d04ff755379ba1337bb725f205f48340a

Authored by 梁灏
1 parent 3f281d6c

update Checkbox 

update Checkbox
Showing 3 changed files with 31 additions and 21 deletions   Show diff stats
Inline Side-by-side
examples/routers/checkbox.vue
  Show/Hide comments   View file @99cde29
@@ -27,9 +27,17 @@ @@ -27,9 +27,17 @@
27 <div @click="c">修改1</div> 27 <div @click="c">修改1</div>
28 {{ fruit }} 28 {{ fruit }}
29 <Checkbox-group v-model="fruit"> 29 <Checkbox-group v-model="fruit">
30 - <Checkbox label="香蕉"></Checkbox>  
31 - <Checkbox label="苹果"></Checkbox>  
32 - <Checkbox label="西瓜"></Checkbox> 30 + <Row>
  31 + <i-col span="8">
  32 + <Checkbox label="香蕉"></Checkbox>
  33 + </i-col>
  34 + <i-col span="8">
  35 + <Checkbox label="苹果"></Checkbox>
  36 + </i-col>
  37 + <i-col span="8">
  38 + <Checkbox label="西瓜"></Checkbox>
  39 + </i-col>
  40 + </Row>
33 </Checkbox-group> 41 </Checkbox-group>
34 <br><br> 42 <br><br>
35 <div style="border-bottom: 1px solid #e9e9e9;padding-bottom:6px;margin-bottom:6px;"> 43 <div style="border-bottom: 1px solid #e9e9e9;padding-bottom:6px;margin-bottom:6px;">
src/components/checkbox/checkbox-group.vue
  Show/Hide comments   View file @99cde29
@@ -4,6 +4,7 @@ @@ -4,6 +4,7 @@
4 </div> 4 </div>
5 </template> 5 </template>
6 <script> 6 <script>
  7 + import { findComponentsDownward } from '../../utils/assist';
7 import Emitter from '../../mixins/emitter'; 8 import Emitter from '../../mixins/emitter';
8 const prefixCls = 'ivu-checkbox-group'; 9 const prefixCls = 'ivu-checkbox-group';
9 10
@@ -20,7 +21,8 @@ @@ -20,7 +21,8 @@
20 }, 21 },
21 data () { 22 data () {
22 return { 23 return {
23 - currentValue: this.value 24 + currentValue: this.value,
  25 + childrens: []
24 }; 26 };
25 }, 27 },
26 computed: { 28 computed: {
@@ -34,15 +36,18 @@ @@ -34,15 +36,18 @@
34 methods: { 36 methods: {
35 updateModel (update) { 37 updateModel (update) {
36 const value = this.value; 38 const value = this.value;
  39 + this.childrens = findComponentsDownward(this, 'Checkbox');
37 40
38 - this.$children.forEach((child) => {  
39 - child.model = value; 41 + if (this.childrens) {
  42 + this.childrens.forEach(child => {
  43 + child.model = value;
40 44
41 - if (update) {  
42 - child.currentValue = value.indexOf(child.label) >= 0;  
43 - child.group = true;  
44 - }  
45 - }); 45 + if (update) {
  46 + child.currentValue = value.indexOf(child.label) >= 0;
  47 + child.group = true;
  48 + }
  49 + });
  50 + }
46 }, 51 },
47 change (data) { 52 change (data) {
48 this.currentValue = data; 53 this.currentValue = data;
src/components/checkbox/checkbox.vue
  Show/Hide comments   View file @99cde29
@@ -22,6 +22,7 @@ @@ -22,6 +22,7 @@
22 </label> 22 </label>
23 </template> 23 </template>
24 <script> 24 <script>
  25 + import { findComponentUpward } from '../../utils/assist';
25 import Emitter from '../../mixins/emitter'; 26 import Emitter from '../../mixins/emitter';
26 27
27 const prefixCls = 'ivu-checkbox'; 28 const prefixCls = 'ivu-checkbox';
@@ -51,7 +52,8 @@ @@ -51,7 +52,8 @@
51 model: [], 52 model: [],
52 currentValue: this.value, 53 currentValue: this.value,
53 group: false, 54 group: false,
54 - showSlot: true 55 + showSlot: true,
  56 + parent: findComponentUpward(this, 'CheckboxGroup')
55 }; 57 };
56 }, 58 },
57 computed: { 59 computed: {
@@ -83,16 +85,11 @@ @@ -83,16 +85,11 @@
83 } 85 }
84 }, 86 },
85 mounted () { 87 mounted () {
86 - // todo 使用 while向上查找  
87 - if (this.$parent && this.$parent.$options.name === 'CheckboxGroup') this.group = true; 88 + this.parent = findComponentUpward(this, 'CheckboxGroup');
  89 + if (this.parent) this.group = true;
88 if (!this.group) { 90 if (!this.group) {
89 this.updateModel(); 91 this.updateModel();
90 -// if (this.$refs.slot && this.$refs.slot.innerHTML === '') {  
91 -// this.showSlot = false;  
92 -// }  
93 - if (this.$slots.default === undefined) {  
94 - this.showSlot = false;  
95 - } 92 + this.showSlot = this.$slots.default === undefined;
96 } 93 }
97 }, 94 },
98 methods: { 95 methods: {
@@ -106,7 +103,7 @@ @@ -106,7 +103,7 @@
106 this.$emit('input', checked); 103 this.$emit('input', checked);
107 104
108 if (this.group) { 105 if (this.group) {
109 - this.$parent.change(this.model); 106 + this.parent.change(this.model);
110 } else { 107 } else {
111 this.$emit('on-change', checked); 108 this.$emit('on-change', checked);
112 this.dispatch('FormItem', 'on-form-change', checked); 109 this.dispatch('FormItem', 'on-form-change', checked);