diff --git a/components/badge/Badge.jsx b/components/badge/Badge.jsx
index ab7a6deec..aa2c87ce6 100644
--- a/components/badge/Badge.jsx
+++ b/components/badge/Badge.jsx
@@ -45,14 +45,14 @@ export default {
$slots,
numberStyle,
} = this
- const isDot = dot || status
let displayCount = count > overflowCount ? `${overflowCount}+` : count
+ const isZero = displayCount === '0' || displayCount === 0
+ const isDot = (dot && !isZero) || status
// dot mode don't need count
if (isDot) {
displayCount = ''
}
const children = filterEmpty($slots.default)
- const isZero = displayCount === '0' || displayCount === 0
const isEmpty = displayCount === null || displayCount === undefined || displayCount === ''
const hidden = (isEmpty || (isZero && !showZero)) && !isDot
const statusCls = classNames({
@@ -62,7 +62,7 @@ export default {
const scrollNumberCls = classNames({
[`${prefixCls}-dot`]: isDot,
[`${prefixCls}-count`]: !isDot,
- [`${prefixCls}-multiple-words`]: count && count.toString && count.toString().length > 1,
+ [`${prefixCls}-multiple-words`]: !isDot && count && count.toString && count.toString().length > 1,
[`${prefixCls}-status-${status}`]: !!status,
})
const badgeCls = classNames(prefixCls, {
diff --git a/components/badge/demo/dot.md b/components/badge/demo/dot.md
index 019590acf..5110baa10 100644
--- a/components/badge/demo/dot.md
+++ b/components/badge/demo/dot.md
@@ -6,6 +6,7 @@
#### Red badge
This will simply display a red badge, without a specific count.
+If count equals 0, it won't display the dot.
```html
@@ -14,6 +15,9 @@ This will simply display a red badge, without a specific count.
+
+
+
Link something
diff --git a/components/badge/style/index.less b/components/badge/style/index.less
index 336e4dbc3..988687702 100644
--- a/components/badge/style/index.less
+++ b/components/badge/style/index.less
@@ -113,7 +113,9 @@
top: auto;
display: block;
position: relative;
- transform: none !important;
+ }
+ &-not-a-wrapper .@{badge-prefix-cls}-count {
+ transform: none;
}
}