feat(Icon): size prop support number type (#1978)

packages/icon/README.md

@@ -39,7 +39,7 @@
 | name | 图标名称或图片链接 | *string* | - | - |
 | info | 图标右上角文字提示 | *string \| number* | - | - |
 | color | 图标颜色 | *string* | `inherit` | - |
-| size | 图标大小，如 `20px`，`2em` | *string* | `inherit` | - |
+| size | 图标大小，如 `20px`，`2em`，默认单位为`px` | *string \| number* | `inherit` | - |
 | custom-style | 自定义样式 | *string* | - | - |
 | class-prefix | 类名前缀 | *string* | `van-icon` | - |
 

packages/icon/index.ts

@@ -1,9 +1,13 @@
 import { VantComponent } from '../common/component';
+import { addUnit } from '../common/utils';
 
 VantComponent({
   props: {
     info: null,
-    size: String,
+    size: {
+      type: null,
+      observer: 'setSizeWithUnit'
+    },
     color: String,
     customStyle: String,
     classPrefix: {
@@ -20,9 +24,19 @@ VantComponent({
     }
   },
 
+  data: {
+    sizeWithUnit: null,
+  },
+
   methods: {
     onClick() {
       this.$emit('click');
+    },
+
+    setSizeWithUnit(size: string | number): void {
+      this.set({
+        sizeWithUnit: addUnit(size)
+      });
     }
   }
 });

packages/icon/index.wxml

@@ -1,6 +1,6 @@
 <view
   class="custom-class {{ classPrefix }} {{ isImageName ? 'van-icon--image' : classPrefix + '-' + name }}"
-  style="{{ color ? 'color: ' + color + ';' : '' }}{{ size ? 'font-size: ' + size + ';' : '' }}{{ customStyle }}"
+  style="{{ color ? 'color: ' + color + ';' : '' }}{{ size ? 'font-size: ' + sizeWithUnit + ';' : '' }}{{ customStyle }}"
   bind:tap="onClick"
 >
   <van-info