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; } }