feat(GridItem): add info & dot props (#2073)

example/pages/grid/index.wxml

@@ -36,3 +36,10 @@
     <van-grid-item icon="search" link-type="reLaunch" url="/pages/dashboard/index" text="ReLaunch 跳转" />
   </van-grid>
 </demo-block>
+
+<demo-block title="提示信息">
+  <van-grid column-num="2">
+    <van-grid-item icon="home-o" text="文字" dot />
+    <van-grid-item icon="search" text="文字" info="99+" />
+  </van-grid>
+</demo-block>

packages/grid-item/index.ts

@@ -14,6 +14,8 @@ VantComponent({
 
   props: {
     icon: String,
+    dot: Boolean,
+    info: null,
     text: String,
     useSlot: Boolean
   },

packages/grid-item/index.wxml

@@ -7,7 +7,7 @@
     </block>
     <block wx:else>
       <view class="van-grid-item__icon">
-        <van-icon wx:if="{{ icon }}" name="{{ icon }}" />
+        <van-icon wx:if="{{ icon }}" name="{{ icon }}" dot="{{ dot }}" info="{{ info }}" />
         <slot wx:else name="icon"></slot>
       </view>
       <view class="van-grid-item__text">

packages/grid/README.md

@@ -96,6 +96,17 @@
 </van-grid>
 ```
 
+### 提示信息
+
+设置`dot`属性后，会在图标右上角展示一个小红点。设置`info`属性后，会在图标右上角展示相应的徽标
+
+```html
+<van-grid column-num="2">
+  <van-grid-item icon="home-o" text="文字" dot />
+  <van-grid-item icon="search" text="文字" info="99+" />
+</van-grid>
+```
+
 ## API
 
 ### Grid Props
@@ -116,6 +127,8 @@
 |-----------|-----------|-----------|-------------|-------------|
 | text | 文字 | *string* | - | - |
 | icon | 图标名称或图片链接，可选值见 [Icon 组件](/#/icon) | *string* | - | - |
+| dot | 是否显示图标右上角小红点 | *boolean* | `false` | - |
+| info | 图标右上角徽标的内容 | *string \| number* | - | - |
 | url | 点击后跳转的链接地址 | *string* | - | -    |
 | link-type | 链接跳转类型，可选值为 `redirectTo` `switchTab` `reLaunch` | *string* | `navigateTo` | - |