diff --git a/packages/checkbox/README.md b/packages/checkbox/README.md index 1b2f56fb..d671853f 100644 --- a/packages/checkbox/README.md +++ b/packages/checkbox/README.md @@ -201,6 +201,7 @@ Page({ | label-position | 文本位置,可选值为 `left` | *string* | `right` | - | | use-icon-slot | 是否使用 icon slot | *boolean* | `false` | - | | checked-color | 选中状态颜色 | *string* | `#1989fa` | - | +| icon-size | icon 大小 | *string \| number* | `20px` | ### CheckboxGroup API diff --git a/packages/checkbox/index.less b/packages/checkbox/index.less index d487cfc1..0668460a 100644 --- a/packages/checkbox/index.less +++ b/packages/checkbox/index.less @@ -17,10 +17,10 @@ &__icon { display: block; box-sizing: border-box; - width: @checkbox-size; - height: @checkbox-size; + width: 1em; + height: 1em; color: transparent; - font-size: 14px; + font-size: @checkbox-size; text-align: center; border: 1px solid @checkbox-border-color; transition-duration: @checkbox-transition-duration; diff --git a/packages/checkbox/index.ts b/packages/checkbox/index.ts index 7dc7368f..95f29f23 100644 --- a/packages/checkbox/index.ts +++ b/packages/checkbox/index.ts @@ -1,4 +1,5 @@ import { VantComponent } from '../common/component'; +import { addUnit } from '../common/utils'; function emit(target: WechatMiniprogram.Component.TrivialInstance, value: boolean | any[]) { target.$emit('input', value); @@ -31,9 +32,17 @@ VantComponent({ shape: { type: String, value: 'round' + }, + iconSize: { + type: null, + observer: 'setSizeWithUnit' } }, + data: { + sizeWithUnit: '20px' + }, + methods: { emitChange(value: boolean) { if (this.parent) { @@ -78,6 +87,12 @@ VantComponent({ emit(parent, parentValue); } } - } + }, + + setSizeWithUnit(size: string | number): void { + this.set({ + sizeWithUnit: addUnit(size) + }); + }, } }); diff --git a/packages/checkbox/index.wxml b/packages/checkbox/index.wxml index 1659ba43..65124a16 100644 --- a/packages/checkbox/index.wxml +++ b/packages/checkbox/index.wxml @@ -6,10 +6,11 @@