diff --git a/packages/common/style/var.less b/packages/common/style/var.less
index 35b31265..05d0b794 100644
--- a/packages/common/style/var.less
+++ b/packages/common/style/var.less
@@ -87,6 +87,8 @@
@info-font-weight: 500;
@info-border-width: 1px;
@info-background-color: @red;
+@info-dot-color: @red;
+@info-dot-size: 8px;
@info-font-family: PingFang SC, Helvetica Neue, Arial, sans-serif;
// NavBar
diff --git a/packages/icon/README.md b/packages/icon/README.md
index b2443048..b2eeb16c 100644
--- a/packages/icon/README.md
+++ b/packages/icon/README.md
@@ -25,9 +25,12 @@
```
-### 显示徽标
+### 提示信息
- ```html
+设置`dot`属性后,会在图标右上角展示一个小红点。设置`info`属性后,会在图标右上角展示相应的徽标
+
+```html
+
```
@@ -39,6 +42,7 @@
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|-----------|-----------|-----------|-------------|-------------|
| name | 图标名称或图片链接 | *string* | - | - |
+| dot | 是否显示图标右上角小红点 | *boolean* | `false` | - |
| info | 图标右上角文字提示 | *string \| number* | - | - |
| color | 图标颜色 | *string* | `inherit` | - |
| size | 图标大小,如 `20px`,`2em`,默认单位为`px` | *string \| number* | `inherit` | - |
diff --git a/packages/icon/index.ts b/packages/icon/index.ts
index ef515ac9..1878549c 100644
--- a/packages/icon/index.ts
+++ b/packages/icon/index.ts
@@ -3,6 +3,7 @@ import { addUnit } from '../common/utils';
VantComponent({
props: {
+ dot: Boolean,
info: null,
size: {
type: null,
diff --git a/packages/icon/index.wxml b/packages/icon/index.wxml
index 2028681d..c568b58e 100644
--- a/packages/icon/index.wxml
+++ b/packages/icon/index.wxml
@@ -4,7 +4,8 @@
bind:tap="onClick"
>
diff --git a/packages/info/index.less b/packages/info/index.less
index 7891117e..6840267e 100644
--- a/packages/info/index.less
+++ b/packages/info/index.less
@@ -21,4 +21,12 @@
.theme(background-color, '@info-background-color');
.theme(border, '@info-border-width solid @white');
.theme(border-radius, '@info-size');
+
+ &--dot {
+ min-width: 0;
+ border-radius: 100%;
+ .theme(width, '@info-dot-size');
+ .theme(height, '@info-dot-size');
+ .theme(background-color, '@info-dot-color');
+ }
}
diff --git a/packages/info/index.ts b/packages/info/index.ts
index a90bcf73..0dbe9036 100644
--- a/packages/info/index.ts
+++ b/packages/info/index.ts
@@ -2,6 +2,7 @@ import { VantComponent } from '../common/component';
VantComponent({
props: {
+ dot: Boolean,
info: null,
customStyle: String
}
diff --git a/packages/info/index.wxml b/packages/info/index.wxml
index bf175a09..3112dfc9 100644
--- a/packages/info/index.wxml
+++ b/packages/info/index.wxml
@@ -1,5 +1,7 @@
+
+
{{ info }}
+>{{ dot ? '' : info }}