fix badge

pull/165/head
wangxueliang 2018-04-09 17:01:34 +08:00
parent f100f0deb3
commit 6cc8ce45e6
3 changed files with 10 additions and 4 deletions

View File

@ -45,14 +45,14 @@ export default {
$slots, $slots,
numberStyle, numberStyle,
} = this } = this
const isDot = dot || status
let displayCount = count > overflowCount ? `${overflowCount}+` : count let displayCount = count > overflowCount ? `${overflowCount}+` : count
const isZero = displayCount === '0' || displayCount === 0
const isDot = (dot && !isZero) || status
// dot mode don't need count // dot mode don't need count
if (isDot) { if (isDot) {
displayCount = '' displayCount = ''
} }
const children = filterEmpty($slots.default) const children = filterEmpty($slots.default)
const isZero = displayCount === '0' || displayCount === 0
const isEmpty = displayCount === null || displayCount === undefined || displayCount === '' const isEmpty = displayCount === null || displayCount === undefined || displayCount === ''
const hidden = (isEmpty || (isZero && !showZero)) && !isDot const hidden = (isEmpty || (isZero && !showZero)) && !isDot
const statusCls = classNames({ const statusCls = classNames({
@ -62,7 +62,7 @@ export default {
const scrollNumberCls = classNames({ const scrollNumberCls = classNames({
[`${prefixCls}-dot`]: isDot, [`${prefixCls}-dot`]: isDot,
[`${prefixCls}-count`]: !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, [`${prefixCls}-status-${status}`]: !!status,
}) })
const badgeCls = classNames(prefixCls, { const badgeCls = classNames(prefixCls, {

View File

@ -6,6 +6,7 @@
<us> <us>
#### Red badge #### Red badge
This will simply display a red badge, without a specific count. This will simply display a red badge, without a specific count.
If count equals 0, it won't display the dot.
</us> </us>
```html ```html
@ -14,6 +15,9 @@ This will simply display a red badge, without a specific count.
<a-badge dot> <a-badge dot>
<a-icon type="notification" /> <a-icon type="notification" />
</a-badge> </a-badge>
<a-badge :count="0" dot>
<a-icon type="notification" />
</a-badge>
<a-badge dot> <a-badge dot>
<a href="#">Link something</a> <a href="#">Link something</a>
</a-badge> </a-badge>

View File

@ -113,7 +113,9 @@
top: auto; top: auto;
display: block; display: block;
position: relative; position: relative;
transform: none !important; }
&-not-a-wrapper .@{badge-prefix-cls}-count {
transform: none;
} }
} }