mirror of
				https://gitee.com/vant-contrib/vant.git
				synced 2025-10-27 01:32:10 +08:00 
			
		
		
		
	feat(Checkbox): rename bind-parent to bind-group
This commit is contained in:
		
							parent
							
								
									444485f974
								
							
						
					
					
						commit
						294ffd4f55
					
				| @ -84,27 +84,6 @@ | |||||||
|         </van-cell-group> |         </van-cell-group> | ||||||
|       </van-checkbox-group> |       </van-checkbox-group> | ||||||
|     </demo-block> |     </demo-block> | ||||||
|     <demo-block :title="$t('title6')"> |  | ||||||
|       <van-checkbox v-model="selectAll">{{ $t('selectAll') }}</van-checkbox> |  | ||||||
|       <van-checkbox-group |  | ||||||
|         v-model="result4" |  | ||||||
|         @change="select4" |  | ||||||
|       > |  | ||||||
|         <van-checkbox |  | ||||||
|           v-for="(item, index) in list" |  | ||||||
|           :key="index" |  | ||||||
|           :name="item" |  | ||||||
|         > |  | ||||||
|           {{ $t('checkbox') }} {{ item }} |  | ||||||
|         </van-checkbox> |  | ||||||
|         <van-checkbox |  | ||||||
|           :bind-parent="false" |  | ||||||
|           v-model="other" |  | ||||||
|         > |  | ||||||
|           {{ $t('checkbox') }} {{ $t('other') }} |  | ||||||
|         </van-checkbox> |  | ||||||
|       </van-checkbox-group> |  | ||||||
|     </demo-block> |  | ||||||
|   </demo-section> |   </demo-section> | ||||||
| </template> | </template> | ||||||
| 
 | 
 | ||||||
| @ -117,10 +96,7 @@ export default { | |||||||
|       customColor: '自定义颜色', |       customColor: '自定义颜色', | ||||||
|       title3: '复选框组', |       title3: '复选框组', | ||||||
|       title4: '设置最大可选数', |       title4: '设置最大可选数', | ||||||
|       title5: '搭配单元格组件使用', |       title5: '搭配单元格组件使用' | ||||||
|       title6: '取消和复选框组的绑定', |  | ||||||
|       other: '其他', |  | ||||||
|       selectAll: '全选', |  | ||||||
|     }, |     }, | ||||||
|     'en-US': { |     'en-US': { | ||||||
|       checkbox: 'Checkbox', |       checkbox: 'Checkbox', | ||||||
| @ -128,10 +104,7 @@ export default { | |||||||
|       customColor: 'Custom Color', |       customColor: 'Custom Color', | ||||||
|       title3: 'Checkbox Group', |       title3: 'Checkbox Group', | ||||||
|       title4: 'Maximum amount of checked options', |       title4: 'Maximum amount of checked options', | ||||||
|       title5: 'Inside a Cell', |       title5: 'Inside a Cell' | ||||||
|       title6: 'Cancel Bind Group', |  | ||||||
|       other: 'other', |  | ||||||
|       selectAll: 'select all', |  | ||||||
|     } |     } | ||||||
|   }, |   }, | ||||||
| 
 | 
 | ||||||
| @ -148,34 +121,16 @@ export default { | |||||||
|       result: ['a', 'b'], |       result: ['a', 'b'], | ||||||
|       result2: [], |       result2: [], | ||||||
|       result3: [], |       result3: [], | ||||||
|       result4: [], |  | ||||||
|       other: true, |  | ||||||
|       selectAll: false, |  | ||||||
|       icon: { |       icon: { | ||||||
|         normal: 'https://img.yzcdn.cn/public_files/2017/10/13/c547715be149dd3faa817e4a948b40c4.png', |         normal: 'https://img.yzcdn.cn/public_files/2017/10/13/c547715be149dd3faa817e4a948b40c4.png', | ||||||
|         active: 'https://img.yzcdn.cn/public_files/2017/10/13/793c77793db8641c4c325b7f25bf130d.png' |         active: 'https://img.yzcdn.cn/public_files/2017/10/13/793c77793db8641c4c325b7f25bf130d.png' | ||||||
|       } |       } | ||||||
|     }; |     }; | ||||||
|   }, |   }, | ||||||
|   watch: { | 
 | ||||||
|     selectAll() { |  | ||||||
|       if (this.selectAll) { |  | ||||||
|         this.result4 = this.list; |  | ||||||
|       } else { |  | ||||||
|         this.result4 = []; |  | ||||||
|       } |  | ||||||
|     } |  | ||||||
|   }, |  | ||||||
|   methods: { |   methods: { | ||||||
|     toggle(index) { |     toggle(index) { | ||||||
|       this.$refs.checkboxes[index].toggle(); |       this.$refs.checkboxes[index].toggle(); | ||||||
|     }, |  | ||||||
|     select4() { |  | ||||||
|       if (this.result4.length === 3) { |  | ||||||
|         this.selectAll = true; |  | ||||||
|       } else { |  | ||||||
|         this.selectAll = false; |  | ||||||
|       } |  | ||||||
|     } |     } | ||||||
|   } |   } | ||||||
| }; | }; | ||||||
|  | |||||||
| @ -145,6 +145,7 @@ export default { | |||||||
| | label-disabled | Whether to disable label click | `Boolean` | `false` | | | label-disabled | Whether to disable label click | `Boolean` | `false` | | ||||||
| | label-position | Can be set to `left` | `String` | `right` | | | label-position | Can be set to `left` | `String` | `right` | | ||||||
| | checked-color | Checked color | `String` | `#1989fa` | - | | | checked-color | Checked color | `String` | `#1989fa` | - | | ||||||
|  | | bind-group | Whether to bind with CheckboxGroup | `boolean` | `true` | | ||||||
| 
 | 
 | ||||||
| ### CheckboxGroup API | ### CheckboxGroup API | ||||||
| 
 | 
 | ||||||
|  | |||||||
| @ -75,12 +75,13 @@ test('checkbox group', async () => { | |||||||
|   await later(); |   await later(); | ||||||
|   expect(wrapper.vm.result).toEqual(['b']); |   expect(wrapper.vm.result).toEqual(['b']); | ||||||
| }); | }); | ||||||
|  | 
 | ||||||
| test('checkbox group unbind', async () => { | test('checkbox group unbind', async () => { | ||||||
|   const wrapper = mount({ |   const wrapper = mount({ | ||||||
|     template: ` |     template: ` | ||||||
|       <checkbox-group v-model="result" :max="2"> |       <checkbox-group v-model="result" :max="2"> | ||||||
|         <checkbox v-for="item in list" :key="item" :name="item"></checkbox> |         <checkbox v-for="item in list" :key="item" :name="item" /> | ||||||
|         <checkbox :bind-parent='false' v-model="other"></checkbox> |         <checkbox :bind-parent='false' v-model="value" /> | ||||||
|       </checkbox-group> |       </checkbox-group> | ||||||
|     `,
 |     `,
 | ||||||
|     components: { |     components: { | ||||||
| @ -90,6 +91,7 @@ test('checkbox group unbind', async () => { | |||||||
|     data() { |     data() { | ||||||
|       return { |       return { | ||||||
|         result: [], |         result: [], | ||||||
|  |         value: false, | ||||||
|         list: ['a', 'b', 'c'] |         list: ['a', 'b', 'c'] | ||||||
|       }; |       }; | ||||||
|     } |     } | ||||||
| @ -99,10 +101,7 @@ test('checkbox group unbind', async () => { | |||||||
|   icons.at(3).trigger('click'); |   icons.at(3).trigger('click'); | ||||||
|   await later(); |   await later(); | ||||||
|   expect(wrapper.vm.result).toEqual([]); |   expect(wrapper.vm.result).toEqual([]); | ||||||
| 
 |   expect(wrapper.vm.value).toBeTruthy(); | ||||||
|   icons.at(3).trigger('click'); |  | ||||||
|   await later(); |  | ||||||
|   expect(wrapper.vm.result).toEqual([]); |  | ||||||
| }); | }); | ||||||
| 
 | 
 | ||||||
| test('click event', () => { | test('click event', () => { | ||||||
|  | |||||||
| @ -79,7 +79,6 @@ export default { | |||||||
|   > |   > | ||||||
|     复选框 {{ item }} |     复选框 {{ item }} | ||||||
|   </van-checkbox> |   </van-checkbox> | ||||||
|   <vant-checkbox :bind-parent="false">不与复选框组绑定</vant-checkbox> |  | ||||||
| </van-checkbox-group> | </van-checkbox-group> | ||||||
| ``` | ``` | ||||||
| 
 | 
 | ||||||
| @ -149,7 +148,7 @@ export default { | |||||||
| | label-disabled | 是否禁用复选框文本点击 | `Boolean` | `false` | - | | | label-disabled | 是否禁用复选框文本点击 | `Boolean` | `false` | - | | ||||||
| | label-position | 文本位置,可选值为 `left` | `String` | `right` | 1.1.11 | | | label-position | 文本位置,可选值为 `left` | `String` | `right` | 1.1.11 | | ||||||
| | checked-color | 选中状态颜色 | `String` | `#1989fa` | 1.4.3 | | | checked-color | 选中状态颜色 | `String` | `#1989fa` | 1.4.3 | | ||||||
| | bind-parent | 与复选框组绑定 | `boolean` | `true` | xxx | | | bind-group | 是否与复选框组绑定 | `boolean` | `true` | 1.6.26 | | ||||||
| 
 | 
 | ||||||
| ### CheckboxGroup API | ### CheckboxGroup API | ||||||
| 
 | 
 | ||||||
|  | |||||||
| @ -18,9 +18,9 @@ export const CheckboxMixin = (parent, bem) => ({ | |||||||
|       type: String, |       type: String, | ||||||
|       default: 'round' |       default: 'round' | ||||||
|     }, |     }, | ||||||
|     bindParent: { |     bindGroup: { | ||||||
|       type: Boolean, |       type: Boolean, | ||||||
|       default: true, |       default: true | ||||||
|     } |     } | ||||||
|   }, |   }, | ||||||
| 
 | 
 | ||||||
|  | |||||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user